Animații CSS. Prefixuri specifice browserului.
Partajeaza in Google Classroom
Memorator: Descriere video Descarcă PDF
Unele browsere mai vechi au nevoie de prefixe specifice (-webkit-) pentru a înțelege proprietățiile de animație:
Exemplu:
div {
width: 100px;
height: 100px;
background-color: red;
-webkit-animation-name: example; /* Safari 4.0 - 8.0 */
-webkit-animation-duration: 4s; /* Safari 4.0 - 8.0 */
animation-name: example;
animation-duration: 4s;
}
/* Safari 4.0 - 8.0 */
@-webkit-keyframes example {
from {background-color: red;}
to {background-color: yellow;}
}
/* Standard syntax */
@keyframes example {
from {background-color: red;}
to {background-color: yellow;}
}