May 5, 2012
css-animations/animation-direction/reverse
Question by SakerONE
#div {
position: absolute; top: 50px;
width: 100px; height: 100px; background: blue;
-webkit-animation-name: shift;
-webkit-animation-duration: 10s;
-webkit-animation-iteration-count: 2;
-webkit-animation-direction: reverse;
}
@-webkit-keyframes shift{
from{
top: 50px;
left: 0px;
}
20% {
top: 150px;
left: 100px;
}
to {
top: 400px;
left: 300px;
}
}
http://jsfiddle.net/uVv65/2/
why do the reverse animation-direction is the same as normal? I thought it would go from
top: 400px;
left: 300px;
to
top: 50px;
left: 0px;