如何停止我的动画

Question

我希望块从一个点到另一个点.在小提琴中你可以看到在动画之后,该块会回到它的第一个位置.

我怎么能防止这种情况？

http://jsfiddle.net/2nT2S/

css

div
{
width:100px;
height:100px;
background:black;
position:relative;
animation:myfirst 2s;
-webkit-animation:myfirst 2s; /* Safari and Chrome */
}

@keyframes myfirst
{
from { left:0px; top:0px; }
to { left:0px; top:200px; }
}

@-webkit-keyframes myfirst /* Safari and Chrome */
{
from { left:0px; top:0px; }
to { left:0px; top:200px; }
}    
</style>

Answer 1

只需将forwards 动画填充模式添加到动画中:

animation:myfirst 2s forwards;
-webkit-animation:myfirst 2s forwards; /* Safari and Chrome */

的jsfiddle