jquery - jQuery Animate on Background 在 FireFox 中不起作用

Question

这适用于 Chrome、Safari 和 IE9。

$(".menu").animate({'background-position-y': '50%'}, 100);

但不是在 Firefox 中！

我现在有点迷路了，FF有简单的解决方法吗？

Answer 1

background-position-x/y并不是任何 CSS 规范的真正组成部分，它的 IE 特定 CSS，添加到 IE5.5，后来由 Webkit 实现。

最好的解决方案是使用该step方法，它可以让您对任何东西进行动画处理。

$('elem').animate({
  'border-spacing': -1000
},
{
  step: function(now, fx) {
    $(fx.elem).css("background-position", "0px "+now+"px");
  },
  duration: 5000
});

http://jsfiddle.net/q9aeh/1/