2010-05-08 16 views
6

J'utilise les transitions CSS3 sur mon site et le -webkit- semble fonctionner, alors que le -moz- ne l'est pas.-webkit- vs -moz-transition

Voici le CSS:

article {z-index: 2; float: left; overflow: hidden; position: relative; -webkit-transition: -webkit-transform 0.2s ease-in-out; -moz-transition: -moz-transform 0.2s ease-in-out; } 

.mousedown{-webkit-transform: translate(-180px, 0) !important; -moz-transform: translate(-180px, 0) !important; } 

Tout en utilisant jQuery pour ajouter la classe mousedown sur l'article.

Une idée où je me trompe?

+0

Quelqu'un pourrait-il expliquer pourquoi cela a été downvoted? Ça me va. –

+0

@Justin E. Morgan Il est sorti de la date, je l'ai mis à jour après le vote à la baisse. – theorise

Répondre

11

Firefox 4 et prend en charge au-dessus -moz-transition. Voir le documentation page.

+0

Mis à jour la réponse à cette question, ancienne était incorrecte, maintenant il est pris en charge. – theorise

2

MISE À JOUR: voir les commentaires. Le support de -moz-transition a été ajouté. Yay!

Il n'y a pas (encore) de -moz-transition, désolé. Mozilla va faire des transformations, mais webkit est toujours le seul moteur de rendu des transitions.

+0

Eh bien cela répond à ma question, et la confusion. Merci! – theorise

+3

Ce n'est plus vrai. https://developer.mozilla.org/en/CSS/-moz-transition – NateDSaint

2

Soutien à -moz-transition a été ajouté dans Gecko 1.9.3 (Firefox 3.7), donc en ce moment -moz-transition ne fonctionnera que dans une version alpha de Firefox 3.7 ou Minefield (Firefox nightly build).

1

opéra soutient depuis 10,5, et beaucoup mieux que WebKit

0

Les transitions CSS fournissent un moyen de contrôler la vitesse d'animation lors de la modification des propriétés CSS. Au lieu que les modifications de propriétés prennent effet immédiatement, vous pouvez provoquer les modifications d'une propriété sur une période donnée. Par exemple, si vous changez la couleur d'un élément du blanc au noir, le changement est généralement instantané. Avec les transitions CSS activées, les changements se produisent à des intervalles de temps qui suivent une courbe d'accélération, qui peuvent tous être personnalisés.

+0

Arun, la question semble demander pourquoi -webkit fonctionne et -moz ne fonctionne pas - pouvez-vous nous éclairer? – wwkudu

+0

moz est un format ou syntaxe firefox, alors que webkit est basé sur chrome et safari chaque fois que des transitions moz sont appliquées dans css, il affecte surtout le navigateur spécifique (firefox), s'il ne fonctionne pas, prend place. –