jQuery背景位置不工作在FireFox？ [英] jQuery background position doesn't work in FireFox?

问题描述

可能重复：

jquery.animate background-position不工作

我有一个小脚本，动画的背景位置，可悲的是它不工作在FireFox。

它可以在IE和Chrome。

  $（'＃background'）。animate（{
'background-position-x'：-1020 
}）; 
  

如何在FireFox中不起作用？

提前感谢！

解决方案

您可以随时创建自己的小插件，不难。

使用jQuery 1.8，我们现在可以访问$ .Animation方法，直接为我们提供动画值，而不需要太多工作，因此我们可以这样做：

  $。fn.animateBG = function（x，y，speed）{
 var pos = this.css（'background-position'）。 
 this.x = parseInt（pos [0]）|| 0; 
 this.y = parseInt（pos [1]）|| 0; 
 $ .Animation（this，{
x：x，
y：y 
}，{
 duration：speed 
}）。 ）{
 this.css（'background-position'，e.tweens [0] .now +'px'+ e.tweens [1] .now +'px'）; 
}）; 
 return this; 
} 
  

然后使用它，我们可以做：

  $（＃background）animateBG（x-值，y-值，速度）; 
  

现场示例：
$（＃background）。animateBG（0px，-45px，300） p>

FIDDLE

免责声明：这不是一个完成和测试的插件，但我花了十分钟在jsFiddle创建，但测试它，并做你需要的更改，工作很适合你。

Possible Duplicate:
jquery.animate background-position doesn't work

I have a small script that animates background positions, sadly it doesn't work in FireFox.
It works in IE and Chrome.

$('#background').animate({
     'background-position-x': -1020
});

How come it doesn't work in FireFox?
Thanks in advance!

解决方案

You can always create your own little plugin, it's not that hard.

Using jQuery 1.8 we now have access to the $.Animation method that gives us the animated values directly without to much work, so we can do something like :

$.fn.animateBG = function(x, y, speed) {
    var pos = this.css('background-position').split(' ');
    this.x = parseInt(pos[0]) || 0;
    this.y = parseInt(pos[1]) || 0;
    $.Animation( this, {
        x: x,
        y: y
      }, { 
        duration: speed
      }).progress(function(e) {
          this.css('background-position', e.tweens[0].now+'px '+e.tweens[1].now+'px');
    });
    return this;
}

And then to use it we can do:

$("#background").animateBG(x-value, y-value, speed);​

live example: $("#background").animateBG("0px", "-45px", 300);​

FIDDLE

Disclaimer: This is not a finished and tested plugin, but something I spent ten minutes creating in jsFiddle, but test it out and do the changes you need to, and it should work just fine for you.

这篇关于jQuery背景位置不工作在FireFox？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！