jQuery Mobile - przejścia
Pozwala na zmianę wartości właściwości, które występują w określonym czasie i zmienia zachowanie elementu z jednego stanu na inny, stosując różne style dla każdego stanu.
Poniższa tabela zawiera listę niektórych przejść stron używanych w strukturze jQuery Mobile -
| Sr.No. | Przejście i opis | W przypadku stron | Do dialogów |
|---|---|---|---|
| 1 | fade Możesz sprawić, że elementy pojawią się i znikną z widoczności. |
Fade Page | Fade Dialog |
| 2 | flip Przerzuć elementy od tyłu do przodu na następną stronę. |
Odwróć stronę | Odwróć okno dialogowe |
| 3 | pop Możesz utworzyć wyskakujące okienko. |
Strona Pop | Dialog pop |
| 4 | flow Wyświetl następną stronę, odsuwając bieżącą stronę. |
Strona przepływu | Okno dialogowe przepływu |
| 5 | slide Możesz przesuwać stronę od prawej do lewej. |
Slide Page | Okno dialogowe slajdów |
| 6 | slidefade Przesuwa stronę od prawej do lewej i zanika na następnej stronie. |
Slidefade Page | Okno dialogowe Slidefade |
| 7 | slideup Przesuwa stronę od dołu do góry. |
Slideup Page | Okno dialogowe Slideup |
| 8 | slidedown Przesuwa stronę od góry do dołu. |
Slidedown Page | Slidedown Dialog |
| 9 | turn Możesz przejść do następnej strony. |
Włącz stronę | Włącz okno dialogowe |
| 10 | none Nie możesz użyć żadnego efektu przejścia, używając tego atrybutu. |
Brak strony | Brak okna dialogowego |
Ustawianie przejścia i konfiguracji globalnej
Domyślnie strony będą miały fadeprzejście w ramach. Możesz użyć niestandardowych przejść, dodającdata-transitionatrybut do łącza. Możesz użyć różnych domyślnych efektów przejścia dla strony za pomocądefaultPageTransitionopcja globalnie. W przypadku okien dialogowych możesz skorzystać zdefaultDialogTransition opcja.
Przejście awaryjne
Wszystkie przejścia obsługują transformacje 3D z wyjątkiem przejścia zanikającego. Urządzenia, które nie obsługują transformacji 3D, będą musiały korzystać z przejścia przez zanikanie. Niektóre przeglądarki nie obsługują transformacji 3D dla każdego typu przejścia, więc możesz użyć rozszerzeniafade jako domyślny rezerwowy przejście.
Max Scroll for Transitions
Przejścia są wyłączone podczas przewijania z lub do strony, a pozycja przewijania będzie trzykrotnie większa od wysokości ekranu urządzenia. Czasami odpowiedź może działać wolno lub przeglądarka może się zawiesić po kliknięciu dowolnego elementu nawigacyjnego; aby tego uniknąć, używamy pozycji przewijania do przejścia za pomocągetMaxScrollForTransition funkcjonować.
Maksymalna szerokość przejść
Możesz wyłączyć przejście, gdy szerokość okna jest większa niż szerokość w pikselach. Możesz skonfigurować maksymalną szerokość przejść za pomocą$.mobile.maxTransitionWidthglobal, która jest domyślnie ustawiona na false. Przyjmuje wartości takie jak szerokość piksela lub wartość fałszu, a przejście zostanie ustawione na brak, jeśli nie jest wartością fałszywą, gdy okno jest wyższe niż określona wartość.
Przejście tej samej strony
Możesz dodać przejścia do bieżącej strony za pomocą allowSamePageTransition opcja widgetu kontenera strony change() metoda.
Tworzenie niestandardowych przejść
Możesz tworzyć niestandardowe przejścia na stronie za pomocą $.mobile.transitionHandlers opcja, która rozszerza wybór przejść w serwisie lub aplikacji.