为什么我的动画在恢复后非常缓慢?
问题描述:
我有一个jQuery动画,动画的'scrollLeft'在容器上产生一种'选取框'的效果。为什么我的动画在恢复后非常缓慢?
我已经设置了鼠标悬停的动画,并在鼠标离开时恢复。
$(banksContainer).mouseover(function() {
$(banksContainer).stop(false);
});
$(banksContainer).mouseleave(function() {
startAnimation();
});
每当我将鼠标移动到动画再关动画,将恢复在非常速度慢,但一分钟左右后逐渐回升。
为什么会发生这种情况,是否可以解决?
PS。下面是按要求startAnimation功能:
// recursive function - represents one cycle of the marquee
function startAnimation() {
$(banksContainer).animate(
{ scrollLeft: scrollLeftEnd },
35000,
"linear",
function() {
$(this)[0].scrollLeft = scrollLeftHome;
startAnimation();
}
);
}
答
这可能是因为当你恢复动画,来覆盖距离已经减少,但时间仍为35秒。因为速度=距离/时间,它会很慢。
我认为你应该设置与剩余距离成比例的时间。这将是35000 *剩余距离/总距离。
这样的事情?
function startAnimation() {
$(banksContainer).animate(
{ scrollLeft: scrollLeftEnd },
35000 * this.scrollLeft()/scrollLeftEnd, //or scrollLeftHome whichever is non-zero
"linear",
function() {
$(this)[0].scrollLeft = scrollLeftHome;
startAnimation();
}
);
}
你可以发布startAnimation函数吗? – cjacques 2009-08-07 06:59:42