анимировать слева направо и справа налево

У меня проблема с анимацией css3; У меня есть две анимации: одна сверху и одна снизу. Верхняя анимация будет загружаться с шириной от 0 до 100%, и она отлично работает, но вторая анимация должна загружаться с шириной от 0 до 100% справа налево и не работает :( Может кто-нибудь объяснить мне, почему? вот пример моей скрипки:

.left-to-right {animation:myfirst 1s ease;}
.right-to-left {animation:mysecond 1s ease;}

@keyframes myfirst {
  0%   {width:0; margin-left:100%;}
    100% {width: 100%; margin-left: 0;}
}
@keyframes mysecond {
  0%   {width:100%; margin-left: 0;}
    100% {width: 0; margin-left:100%;}
}

html css css-animations
person mcmwhfy    schedule 27.06.2014    source источник

Ответы (1)


arrow_upward
3
arrow_downward

Вы сделали ошибку на полях второй анимации. Вы можете удалить их:

ДЕМО

@keyframes mysecond {
    0%   {width:0;}
    100% {width: 100%;}
}
person web-tiki    schedule 27.06.2014