Question

我正在使用一个巨大的精灵作为一个元素，在悬停时改变不同的状态。我想知道是否有办法让悬停状态的图像淡入？您可以实时查看我的代码-此处

以下是我针对每个跨度的悬停状态的代码

$(".hf-1").hover(
        function () {
                $(this).css("background-position","0 -121px")；
                $(".hf-2").css("background-position","0 -242px")；
                $(".hf-3").css("background-position","0 -363px")；
                $(".hf-4").css("background-position","0 -484px")；
              },
        function () {}

)；

我使用Jquery来做背景图像悬停，而不是基本的css，因为我有多个悬停需要重置。

谢谢你的帮助。

Answer 1

使用以下内容：

$(this).animate({"background-position": "0 -121px"}, "slow");

冲洗并重复其他三个步骤。

Answer 2

你需要将背景叠加两次，然后从另一个渐变。无法在同一个容器中淡入。

Answer 3

或者您可以只使用jquery的本机fadeIn API。

 $(this).click(function () {
            $("this").fadeIn("slow");
          });

友情链接