在这里,我试图使图像沿圆形路径移动,但它没有沿圆形路径移动..我已经尝试过这样的缓慢移动图片
CSS
#friends { position: absolute; }
Markup
<img src="http://jsfiddle.net/img/logo.png"
id="friends"/>
JS
function moveit() {
var newTop = Math.floor(Math.random()*350);
var newLeft = Math.floor(Math.random()*1024);
var newDuration = Math.floor(Math.random()*5000);
$('#friends').animate({
top: newTop,
left: newLeft,
}, newDuration, function() {
moveit();
});
}
$(document).ready(function() {
moveit();
});
现场演示:http://jsfiddle.net/W69s6/embedded/result/
有什么建议吗?
另一种变体(基于Div 使用 Javascript 循环移动):
var t = 0;
function moveit() {
t += 0.05;
var r = 100; // radius
var xcenter = 100; // center X position
var ycenter = 100; // center Y position
var newLeft = Math.floor(xcenter + (r * Math.cos(t)));
var newTop = Math.floor(ycenter + (r * Math.sin(t)));
$('#friends').animate({
top: newTop,
left: newLeft,
}, 1, function() {
moveit();
});
}
$(document).ready(function() {
moveit();
});
DEMO: http://jsfiddle.net/W69s6/20/
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)