我在IE8中收到此错误.
Message: Invalid argument. Line: 156 Char: 295 Code: 0 URI: http://code.jquery.com/jquery-1.4.4.min.js
解决方法
All animated properties should be a
single numeric value (except as noted
below); properties that are
non-numeric cannot be animated using
basic jQuery functionality….
所以,事实上,在Firefox中你使用的是未定义的行为.正确的做法是在backgroundPositionX上制作动画,但Firefox不支持此功能.
但是,有一个jQuery插件可以执行您想要的操作：
http://plugins.jquery.com/project/backgroundPosition-Effect
更新
我把它砍成了这个例子：
http://jsfiddle.net/CxqSs/(见底部的新例子.)
肯定可以使用一些清理,并且应该添加到该插件中,但它可以在两个浏览器中运行,并且不依赖于未定义的行为.
顺便说一句,我不知道是否值得注意,但是如果你让这个动画长时间运行,它最终会溢出值并中断.这可以通过动画背景图像的全长来解决,然后在下一个动画之前将回放中的偏移重置为0px.这也可以避免需要=格式.
也,
应该注意的是速度：1,步长：1和速度：50,步长：50是等效的.
他们看起来速度不同的原因是因为
>速度为1(实际上是毫秒持续时间)的开销更大,因为更频繁地调用animate.
>默认缓动是“摇摆”,这意味着动画在整个过程中会加速并略微减慢,这意味着整体速度会受到一些影响.你应该为你的滚动案例将缓动更改为“线性”：
var animate = function() {
element.animate({
...
},speed,"linear",animate);
};
这意味着您可以使用backgroundPosition-Effect插件,而不使用’=’,将步骤设置为2247(图像的宽度),如上所述.
这终于让我们……等待它……
跨平台,非kludgy,非溢出,正确缓和,额外参数缺乏,解决方案.
