javascript - 最简单的多淡入淡出脚本

Question

我正在寻找像在 Dribbble 上一样工作的脚本(当您将鼠标悬停在上面时会出现覆盖)。但它必须是多...我的意思是用于网站上的许多图像。尽可能简单。

谢谢!

Answer 1

使用 jQuery 和 hover()鼠标事件你可以实现你想要的行为。

$("img").hover(function() { //select the image which is hovered
    $(this).css("opacity","0.5"); //apply opacity for this image

}, function() {
    $(this).css("opacity","1"); //change to opacity to default
});

演示: http://jsfiddle.net/mVWdQ/

对于 selector , 你可以使用 class仅用于所需图像而不是 element作为 img。

另一种方法是使用 animate() .

$("img").hover(function() {
    $(this).animate({opacity:0.5},500);

}, function() {
    $(this).animate({opacity:1},500);
});

演示: http://jsfiddle.net/mVWdQ/1/