javascript - jQuery 动画背景位置不会改变但 css 会

Question

这是奇怪的事情，这个有效:

$('#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; }

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

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

Answer 1

我很确定你不能这样做。

动画文档是这样说的:

most properties that are non-numeric cannot be animated using basic jQuery functionality

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

确实有一个插件可以让你这样做:

http://plugins.jquery.com/project/backgroundPosition-Effect

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