jQuery动画背景位置不会改变，但css会答案

【问题标题】：jQuery animate background position won't change but css doesjQuery动画背景位置不会改变，但css会
【发布时间】：2011-07-20 23:34:03
【问题描述】：

这是奇怪的事情，这是有效的：

$('#box').css({"backgroundPosition": "0px 250px"});

但这不起作用，它只是不改变位置：

$('#box').animate({"backgroundPosition": "0px 250px"});

使用 jQuery 1.5.2 和 1.6.1 在 FF 和 chrome 中测试。

FF 报告“警告：解析 'background-position' 的值时出错。声明已删除。”

我的 CSS 是：

#box { padding-left: 30px; background: url(../img/arrow.gif) 0px 30px no-repeat; }

关于为什么动画不起作用的任何想法？

http://jsfiddle.net/wyhqu/ 的 jsfiddle 尝试将 animate 更改为 css，您会看到它有效

【问题讨论】：

【解决方案1】：

我很确定你不能这样做。

动画文档是这样说的：

大多数非数字属性不能使用基本动画 jQuery 功能

当您传递 2 个数字时，您可以传递“中心”或其他一些非数字值。

似乎有一个插件可以让你这样做：

虽然我没用过，所以不知道它有多好。

【讨论】：

【解决方案2】：

试试这个：

$('#box').animate({"background-position": "0px 250px"});

在 CSS 案例中，它依赖于浏览器来解析“backgroundPosition”，这很好。在动画的情况下，jQuery 必须进行解析。也许开发人员只添加了连字符。

【讨论】：