jquery.animate background-position不起作用

Question

我正在尝试使用动画创建背景位置更改.
但由于某种原因,它不起作用.

<script language="javascript" src="http://code.jquery.com/jquery-1.5.min.js"></script>
<div class="moveme" style="height:80px;width:240px;background-image:url('http://www.google.de/intl/en_com/images/srpr/logo1w.png');background-repeat:no-repeat"></div>

<script language="javascript">
    $('.moveme').css("background-position","0px 0px").animate({backgroundPosition:"-100px 10px"});
</script>

想法？

Answer 1

动画backgroundPosition从JQuery 1.5.0开始不起作用.如果你想让它工作,你将不得不恢复到1.4.4.显然它在1.4.4中工作的事实是巧合,因为"所有动画属性应该被动画化为单个数值,除非如下所述;大多数非数字属性不能使用基本jQuery功能进行动画处理. (例如,宽度,高度或左边可以设置动画,但背景颜色不能.)"由于backgroundPosition需要两个数值,因此不应支持它.

请参阅此错误票证:http://bugs.jquery.com/ticket/8160

一个可能的解决方案:http://bugs.jquery.com/ticket/7755#comment:1

Answer 2

jQuery 默认不支持此功能。

您可以使用以下插件：http://plugins.jquery.com/project/backgroundPosition-Effect

编辑：

我错了，它有效：

$(function() {
  $('.moveme').css("backgroundPosition","0px 0px").animate({"backgroundPosition":"-100px 10px"});
});

如果你在地址栏中输入它就可以了，但似乎我无法在 jsfiddle 上完成这个工作，奇怪...xD