我正在使用 jQuery 制作动画,以在横幅类型容器中缓慢地平移图像。它的工作几乎完美,但似乎有点紧张。我尝试过加快速度和减慢速度,但它仍然摇晃。
我一开始以为这可能是硬件问题,而电脑无法处理高分辨率图像的平移。但我已经通过缩小和降低图片质量确认这不是问题。
您可以在此处查看平移图像:http://parkland2.wethink.ca
动画代码:
jQuery.fn.extend({
letsTravel: function() {
var horizontalRange = jQuery(this).width() - jQuery(this).parent().width();
var verticalRange = jQuery(this).height() - jQuery(this).parent().height();
var halfHeight = div(verticalRange,2);
//horizontalRange and verticalRange are maximum valid horizontal/vertical offset
//all coordinates should be below 0 because start point is 0,0
jQuery(this).animate({left: (horizontalRange-120)*(-1), top: halfHeight*(-1)},20000, 'linear', function(){
jQuery(this).animate({left: horizontalRange*(-1), top: verticalRange*(-1)},20000, 'linear', function(){
jQuery(this).animate({left: (horizontalRange/2)*(-1)},10000, 'linear', function(){
jQuery(this).animate({left: 0, top: halfHeight*(-1)},20000, 'linear', function(){
jQuery(this).animate({top: 0},10000, 'linear');
});
});
});
});
}
});
有什么想法吗?
谢谢
最佳答案
您的代码中有错误。当发生垂直运动时,水平位置不是恒定的。这会导致你的问题。您能为我们提供合适的功能吗?
关于jQuery 动画不稳定,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/9279045/