Question

我用过

$(document).ready(function() {

$("#main ul li").hover(function(){

var fade = $('img.g-img', this);
fade.fadeTo('slow', 0.5);


$("#main ul li").removeClass("active");
$(this).toggleClass("active");

});


});

我想在鼠标移动时停止淡出。此代码无效：

fade.stop().fadeTo('slow',1)

我该怎么做？提前谢谢。

Answer 1

您需要将两个参数传递给hover。（mouseenter处理程序和mouseleave处理程序）

例如：

$(document).ready(function() {
    $("#main ul li").hover(
        function() { //mouseenter handler
            var fade = $('img.g-img', this);
            fade.fadeTo('slow', 0.5);

            $("#main ul li").removeClass("active");
            $(this).toggleClass("active");
        }, 
        function () {  //mouseleave handler
            var fade = $('img.g-img', this);
            fade.stop().fadeTo('slow',1)
        }
    );
});

Answer 2

您定义的fade变量仅在事件处理程序的范围内。另外，hover()需要两个事件处理程序：一个用于鼠标进入时，另一个用于鼠标进入时。

$(document).ready(function() {
  $("#main ul li").hover(function() {
    $(this).addClass("active").find("img.g-img").stop().fadeTo("slow", 0.5);
  }, function() {
    $(this).removeclass("active").find("img.g-img").stop().fadeTo("slow", 1);
  });
});

在jquery中停止fadeTo（）

2 个答案: