Transition mobile jQuery
jQuery Mobile inclut des effets CSS3 qui vous permettent de choisir la façon dont la page s'ouvre.
Effets de changement de page jQuery Mobile
jQuery Mobile fournit divers effets de changement de page vers la page suivante.
Remarque : Afin d'obtenir l'effet de changement de page, le navigateur doit prendre en charge la commutation 3D CSS3 :
12.0 | 10.0 | 16.0 | 4.0 | 15.0 |
Le numéro dans le tableau est le numéro de version minimum du navigateur prenant en charge la rotation 3D.
Les effets de transition de page peuvent être appliqués à n'importe quel lien ou formulaire utilisant l'attribut data-transition :
Les effets de transition de page peuvent être appliqués à toute soumission de lien ou de formulaire utilisant l'attribut data-transition :
<a href="#anylink" data-transition="slide">切换到第二个页面</a>
Le tableau ci-dessous montre les transitions de page disponibles en utilisant l'attribut data-transition :
过渡 | 描述 | 页面 | 对话框 |
---|---|---|---|
fade | 默认。淡入到下一页 | 尝试一下 | 尝试一下 |
flip | 从后向前翻转到下一页 | 尝试一下 | 尝试一下 |
flow | 抛出当前页,进入下一页 | 尝试一下 | 尝试一下 |
pop | 像弹出窗口那样转到下一页。 | 尝试一下 | 尝试一下 |
slide | 从右向左滑动到下一页。 | 尝试一下 | 尝试一下 |
slidefade | 从右向左滑动并淡入到下一页。 | 尝试一下 | 尝试一下 |
slideup | 从下到上滑动到下一页。 | 尝试一下 | 尝试一下 |
slidedown | 从上到下滑动到下一页。 | 尝试一下 | 尝试一下 |
turn | 转向下一页。 | 尝试一下 | 尝试一下 |
none | 无过渡效果。 | 尝试一下 | 尝试一下 |
在 jQuery Mobile 的所有链接上,默认使用淡入淡出的效果(如果浏览器支持)。 |
Astuce : Tous les effets ci-dessus Prise en charge du comportement de secours. Par exemple, si vous souhaitez que la page glisse de gauche à droite au lieu de droite à gauche, utilisez l'attribut data-direction avec une valeur « inverse ». C'est la valeur par défaut sur le bouton de retour.
Instance
<a href="#pagetwo" data-transition="slide" data-direction="reverse">切换</a>
Exécuter l'instance»
Cliquez sur le bouton « Exécuter l'instance » pour afficher l'instance en ligne