1

可能的重复：
jquery 动画背景位置

我有一个按钮，应该在背景元素上有一个动画。

箭头应在悬停时向下滑动，并在悬停时滑动备份。这在 Chrome 上运行良好。

此动画在 Chrome 和 IE8 中正常运行。

IE9：悬停时背景只是翻转而没有滑动效果。但是在悬停时，滑动动画有效。

FF：没什么。没有弹...

http://egelect.com/2013/index-test.php

有什么建议么？

HTML

<div id="bienvenue">Bienvenue<span id="separator">&nbsp;</span></div>

jQuery

<script type="text/javascript">
$('document').ready(function() {
   $('#bienvenue').css({backgroundPosition: "right 100%"}).hover(
       function() {
           $(this).stop().animate({'background-position-y': "0%"}, "600");
       }, function() {
           $(this).stop().animate({'background-position-y': "100%"}, "600");
       }
   );
});
</script>
4

1 回答 1

2

Firefox 不理解background-position-y, only background-position（同时具有 x 和 y 值，按此顺序）。

然而，这是一个声称可以解决问题的插件。或者，您可以用分层图像替换背景图像，并为该位置设置动画。

于 2013-01-18T19:28:42.710 回答