css:
.flightNumber{
display: none;
-moz-transition: opacity 2000ms ease-in-out;
-o-transition: opacity 2000ms ease-in-out;
-webkit-transition: opacity 2000ms ease-in-out;
/*transition: opacity 2000ms ease-in-out;
opacity: 0;
}
.runIn{
-moz-transition: opacity 2000ms ease-in-out;
-o-transition: opacity 2000ms ease-in-out;
-webkit-transition: opacity 2000ms ease-in-out;
/*transition: opacity 2000ms ease-in-out;*/
opacity: 1;
display: block;
}
html代码:<p class='flightNumber'></p>
js代码:$(".flightNumber").addClass("runIn")
display:none Si ceci est ajouté, l'animation ne peut pas être efficace, car display:none signifie que cet élément n'est pas analysé sur la page et que tous les styles de cet élément sont invalides. Sous ce principe, transition: opacity 2000ms easy-in. -out; n'est pas valide, donc aucun effet d'animation n'est possible.
Merci pour l'invitation.
Le chiffre
display
都去掉,另外前缀没必要写,直接原生就行。真有需要的话,可以先
.show()
下嘛(反正你opacity
est 0 et rien n'est visible).