Question

有一个没有背景的链接和一个css规则，它会在悬停时更改背景。

父bg是白色，悬停时链接 - 蓝色。

如何慢慢悬停，从白色到蓝色？

感谢。

li a {}
li a:hover { background: blue; }

Answer 1

jQuery('a#theLink').hover(function(){
    $(this).stop().animate({backgroundColor: 'blue'});
}, function() {
    $(this).stop().animate({backgroundColor: 'white'});
});

为此，您需要为jQuery下载“ color plugin ”。

Answer 2

您不需要额外的颜色插件。你只需要在jQuery之上使用jQuery UI，它也可以让你在颜色上做动画。（或者，如果你不想出于某些原因使用jQuery UI，我想另一个插件可以解决这个问题。但是我已经成功地尝试了这个，只包括jQuery核心和jQuery UI。）

动画本身就像......

$("li").hover(function() {
  $(this).animate({
    backgroundColor: "#ffffff"
  }, 'slow');
});

Answer 3

bgFade一个非常棒的简单插件，动画de background image：

http://www.isthatclear.com/jquery/bgFade/

Answer 4

要为颜色设置动画，您需要color plugin

Answer 5

您需要使用插件，因为JQuery无法开箱即用。

尝试Colour Animation plugin

然后它会像：

$(this).animate({ backgroundColor: "blue" }, 'slow');

Jquery在悬停时淡出背景？

5 个答案: