28172 sujets

CSS et mise en forme, CSS3

Keyframes qui ne se comporte pas comme attendu.

Bonsoir,

cette question est corrélée à celle intitulée Morphing.


@keyframes avant {
0% { content:'Le'; } 7.1428571428571% { opacity:1; } 14.285714285714% { opacity:0; }
14.285714285714% { content:'délimite'; } 21.428571428571% { opacity:1; } 28.571428571429% { opacity:0; }
28.571428571429% { content:'articule'; } 35.714285714286% { opacity:1; } 42.857142857143% { opacity:0; }
42.857142857143% { content:'discours'; } 50% { opacity:1; } 57.142857142857% { opacity:0; }
57.142857142857% { content:'en'; } 64.285714285714% { opacity:1; } 71.428571428571% { opacity:0; }
71.428571428571% { content:'signifiantes'; } 78.571428571429% { opacity:1; } 85.714285714286% { opacity:0; }
85.714285714286% { content:'ou'; } 92.857142857143% { opacity:1; } 100% { opacity:0; }
}


Contrairement à mon attente, "délimite" surgit tout d'un coup, et non progressivement comme je m'y attendrais. Une idée ?
Pour info, le code suivant, plus compact, se comporte de la même façon :

@keyframes avant {
0% { opacity:0; content:'Le'; } 7.1428571428571% { opacity:1; }
14.285714285714% { opacity:0; content:'délimite'; } 21.428571428571% { opacity:1; }
28.571428571429% { opacity:0; content:'articule'; } 35.714285714286% { opacity:1; }
42.857142857143% { opacity:0; content:'discours'; } 50% { opacity:1; }
57.142857142857% { opacity:0; content:'en'; } 64.285714285714% { opacity:1; }
71.428571428571% { opacity:0; content:'signifiantes'; } 78.571428571429% { opacity:1; }
85.714285714286% { opacity:0; content:'ou'; } 92.857142857143% { opacity:1; }
}
Sujet clos
Aller à