Is there a way to modify this code so that the ball moves to the right and remains in that position?
http://codepen.io/chriscoyier/pen/pBCax
You can experiment with the live version of the output by clicking on the link above.
body {
padding: 30px;
}
#animate {
position: absolute;
top: 100px;
left: 30px;
width: 100px;
height: 100px;
border-radius: 50%;
background: red;
animation: move 3s ease infinite;
}
@keyframes move {
50% {
top: 200px;
left: 130px;
}
}
By removing 'infinite' from the CSS code, the ball moves to the right once and then returns back. The goal is for it to move to the right and stay fixed in that position instead.