移动背景 - 跨浏览器

Question

我有一个背景中带有图像的div，它慢慢向左移动。当它到达图像的末尾时，它开始向右移动。它一遍又一遍地重复这个动画。

这是我的小提琴：http://jsfiddle.net/49H65/2/

它似乎在Chrome和Safari中完美运行，但我无法在Firefox中使用它。

这里是可能导致问题的jQuery代码片段，但我并非100％确定：

infiniteAnimate( $('header.nb-slider') ,{
    on:{
        'background-position-x': -slideAnimate,
        'background-position-y': 0
    },off:{
        'background-position-x': $('header.nb-slider').css('background-position-x'), //use style
        'background-position-y': $('header.nb-slider').css('background-position-y') //use style
    }
});

非常感谢任何帮助。谢谢！

Answer 1

您的代码没问题。它的Firefox不理解background-position-x和background-position-y。您必须使用两个以空格分隔的值组合输入FF：

background-position: x-value + ' ' + y-value,

不幸的是，jQuery无法为组合值设置动画，您必须编写自己的函数或使用插件。我试过Keith Wood's jQuery Background Position，它似乎适用于所有浏览器。