如何讓圖片來回走動？

Question

想請問一下
假設我想讓某張圖片在網頁某處來回走動
該怎麼做?

Answer 1

.img-move{
    animation:imgMove 4s linear infinite;
    -moz-animation:imgMove 4s linear infinite;
    -webkit-animation:imgMove 4s linear infinite;
    -o-animation:imgMove 4s linear infinite;
    position: absolute;
}

@keyframes imgMove
{
0%   {right:100px;}
25%{right:150px;}
50%{right:100px;}
75%{right:50px}
100% {right:100px}
}

Answer 2

长期循环的话不建议用JS
css的话有animation可以做自定义动画。
比如将此图片样式改为absolute之类，在动画中修改其left、top值使其移动

Answer 3

css3 animation属性 可以实现

Answer 4

给图片position：absolute；在js里获得它的left值，在定时器里让它每秒增加 达到某个值之后 再让其不断减小