Latest web development tutorials

Transition jQuery Mobile

jQuery Mobile contient l'effet de CSS3 vous permet de sélectionner la page pour ouvrir la voie.


Page jQuery mobile transitions

jQuery Mobile offre une variété de la page passer à la page suivante de résultats.

Remarque: Afin d'obtenir l'effet de commutation de la page, le navigateur doit supporter la commutation CSS3 3D:

12.0 10.0 16,0 4.0 15.0

Les chiffres du tableau à l'appui 3D en rotation minimum le numéro de version du navigateur.

effets de transition Page peuvent être appliqués à toute utilisation de données de transition lien d'attribut ou de la forme:

effets de transition Page peuvent être appliqués à toute utilisation de données de transition lien d'attribut ou la soumission du formulaire:

<a href="#anylink" data-transition="slide">切换到第二个页面</a>

Le tableau suivant présente les données de transition par l'utilisation de propriétés disponibles pour changer de page:

transition description page dialogue
fondu Par défaut. Fondu à la page suivante essayer essayer
chiquenaude De bascule vers l'avant à la page suivante essayer essayer
flux Lance cette page à la page suivante essayer essayer
pop Comme les pop-ups qui vont à la page suivante. essayer essayer
diapositive Balayez de droite à la page suivante. essayer essayer
slidefade Balayez vers la gauche et la droite pour se fanent à la page suivante. essayer essayer
slideUp Faites glisser de bas en haut à la page suivante. essayer essayer
slideDown De haut en bas, diapositive à l'autre. essayer essayer
tour Tournez la page suivante. essayer essayer
aucun Pas d'effet de transition. essayer essayer

lampe Tout lien jQuery Mobile sur l'effet de fondu par défaut (si le navigateur prend en charge).

Note: Tous les effets ci - dessus prennent en charge le comportement en arrière. Par exemple, si vous voulez faire glisser la page de gauche à droite, de droite à gauche au lieu de glisser, la propriété utilisation des données-direction avec la valeur "inverse". Sur le bouton Retour qui est la valeur par défaut.

Exemples

<a href="#pagetwo" data-transition="slide" data-direction="reverse" >切换</a>

Essayez »