Jquery在悬停时淡出背景?

6 javascript css jquery

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

父bg是白色的,悬停链接 - 蓝色.

如何从白色到蓝色缓慢地做悬停效果

谢谢.

li a {}
li a:hover { background: blue; }
Run Code Online (Sandbox Code Playgroud)

Jam*_*mes 11

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

为此,您需要下载jQuery 的" 颜色插件 ".


Jaa*_*nus 7

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

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

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

  • 陈述显而易见的,因为没有其他人,如果你已经在使用jQuery UI,那么你很高兴.如果您不使用jQuery UI,则不要仅为此功能开始使用它 - 使用颜色插件. (4认同)

Jas*_*yon 1

为了使颜色具有动画效果,您需要颜色插件