jQuery 1.6:backgroundPosition与backgroundPositionX和FF4的兼容性

试图升级jQuery插件“iCheckbox”(http://stackoverflow.com/questions/6032538/)为了在jQuery1.4.4上面工作，我发现

 animate({backgroundPosition:'10px 0px'})

需要改成

animate({backgroundPositionX: '10px', backgroundPositionY:  '0px'})

因为只能使用带有一个参数的属性。到目前为止，这是有道理的，但是等等。。虽然它在Safari和Chrome中运行良好，但在FF4中却无法运行（全部在Mac上）

所以我尝试了这个和那个，最后发现如果我把它改成

animate({backgroundPosition: '10px'})

它无处不在！ 但这是怎么回事？现在我只给出了一个参数，它可以工作，但我没有指定它是用于X轴还是Y轴（所以它似乎默认为X轴..但是如果我想让它在Y轴上工作呢？）

这看起来很奇怪，我这里的解决方案不可能是正确的方法。。所以我需要一些建议：

发生什么事了

如何使用jQuery 1.4-1.6设置背景位置的动画，使其跨浏览器工作？

根据：

---

“如果只指定一个值，另一个值将为50%。您可以混合%和位置”

首先，JQuery无法同时设置两个值的动画，因此您看到为

backgroundPosition

输入两个值根本不起作用。还要注意，对于

px

值，建议您不要编写

px

其次，

backgroundPositionX

和

backgroundPositionY

是非标准CSS属性，仅在少数浏览器中受支持，最明显的是IE和最近的Webkit，这就是为什么您会发现它在FF或Opera中不起作用。（）

我发现，在大多数浏览器中，混合使用JQuery的

动画

和CSS转换可以在一个轴上为背景图像制作动画。我将引用我对另一个问题（）的回答：

分别使用JQuery的

.animate（）

和

backgroundPositionX

和

Y

对于IE（这将适用于最新的JQuery）。然后在浏览器中 （除IE外，几乎所有内容）使用

.css（）

而不是

.animate（）

更改背景位置并设置 样式表中的CSS转换

您将用上述内容覆盖大多数浏览器，但可能不是这样 只需使用插件即可兼容。请在此处查看它的工作：

---

如果您喜欢，请快速检查IE7、8、9中的按钮是否工作并滑动，然后在此处的评论中回答？测试：