Переходы jQuery Mobile
jQuery Mobile включает эффекты CSS3, которые позволяют Вам выбирать способ, по которому должна открываться страница.
Эффекты Переходов jQuery Mobile
У jQuery Mobile есть множество эффектов для способа перехода от одной страницы к следующей.
Примечание: Чтобы достигнуть эффекта перехода, браузер должен поддерживать 3-D Преобразования CSS3:
Поддержка Браузеров
- Chrome, Firefox и Safari поддерживают 3D трансформации.
- Internet Explorer 10 поддерживает 3D трансформации (раниие версии - нет)
- Opera пока не поддерживает 3D трансформации
Эффекты перехода могут быть применены к любой ссылке или представлению формы при использовании атрибута data-transition:
Таблица ниже показывает доступные переходы, которые могут использоваться с атрибутом data-transition:
Переход | Описание | Пример |
---|---|---|
fade | По умолчанию. Постепенно переходит к следующей странице | Показать |
flip | Переворачивает следующую страницу снизу вверх | Показать |
flow | Отбрасывает текущую страницу и ставит на ее место следующую страницу | Показать |
pop | Переходит к следующий страницу наподобие всплывающего окна | Показать |
slide | Следующая страница скользит справа налево | Показать |
slidefade | Скользит справа налево и постепенно появляется | Показать |
slideup | Slides to the next page from bottom to top | Показать |
slidedown | Slides to the next page from top to bottom | Показать |
turn | Turns to the next page | Показать |
none | No transition effect | Показать |
Эффект затухания - значение по умолчанию на всех ссылках в jQuery Mobile (если браузер поддерживает его).
Подсказка: Все эффекты выше также поддерживают обратные действия, например, если Вы хотите, чтобы страница скользила слева направо, вместо справа налево, используйте атрибут data-direction со значением "reverse". Это - значение по умолчанию для Кнопок "Назад".
Пример
Попробуйте сами »