内容来源于 Stack Overflow,并遵循CC BY-SA 3.0许可协议进行翻译与使用
我有一个蜜蜂图像,我想用jQuery来做动画。
这个想法是将图像从左边(屏幕外)移动到右边(屏幕外),以创建一个像飞行一样的效果。
你的蜜蜂需要绝对定位,就像这样:
<div id="b" style="position:absolute; top:50px">B</div>
我在这里用过div,但也可以是<img>
标签。不要忘记top
属性,因为有些浏览器没有它就无法工作。然后你可以给它动画:
$(document).ready(function() { $("#b").animate({left: "+=500"}, 2000); $("#b").animate({left: "-=300"}, 1000); });
如果想要连续的动画,那么将动画代码放入函数中,确保左右移动是相同的,并使用动画()的onComplete选项来调用下一个动画:
function beeLeft() { $("#b").animate({left: "-=500"}, 2000, "swing", beeRight); } function beeRight() { $("#b").animate({left: "+=500"}, 2000, "swing", beeLeft); } beeRight();