I'm using this code to make an effect and keep the element in the end position of the animation, that is, to the right.
HTML :
<div id="anim">
</div>
CSS Code :
#anim{
position: relative;
background: green;
width: 100px;
height: 100px;
}
#anim:hover{
-webkit-animation-name: toRight;
animation-duration: 1s;
}
@-webkit-keyframes toRight{
from {left: 0px;}
to {left: 200px;}
}
@keyframes toRight{
from {left: 0px;}
to {left: 200px;}
}