Jquery悬停fadeIn / fadeOut问题

时间:2009-10-30 23:17:29

标签: jquery fade

http://www.izrada-weba.com/orso 鼠标悬停在链接“NENATKRIVENA TERASA ...”子菜单和图像一起淡入。使用一些下载的脚本淡化子菜单,上面的图像使用我的代码淡出:

$(document).ready(function () {
   $("#slika1").hide();

  $("#test,#submenu2").hover(
      function () {
       $("#slika1").fadeIn();
      }, 
      function () {
         $("#slika1").fadeOut();
      }
    );       
});

当鼠标悬停在链接上而不是图像淡入时,当鼠标移动到子菜单时,图像淡出并再次淡入...我知道为什么会这样但我不知道如何使它不淡出将鼠标直接从链接移动到子菜单。 对此有什么解决方案吗?

谢谢, ILE

2 个答案:

答案 0 :(得分:16)

函数stop()将停止指定元素上当前正在运行的任何动画 尝试修改鼠标悬停功能:

$("#slika1").stop().fadeIn();


修改
子菜单似乎没有问题一直没有消失(参见ile的评论)。在我看来,这似乎是一个jQuery错误,但我不确定。也许有人可以插话并解释为什么会发生这种情况 为了解决这个问题,请尝试使用fadeTo();它似乎产生了预期的结果:

$(document).ready(function () {
  $("#slika1").fadeTo(0,0);

  $("#test,#submenu2").hover(
    function () {
      $("#slika1").stop(true).fadeTo("normal",1);
    }, 
    function () {
      $("#slika1").fadeTo("normal",0);
    }
  );       
});

答案 1 :(得分:1)

fadeIn()被中断时fadeOut()无效的问题是因为fadeIn()仅在隐藏元素时才有效。无论你称它为bug还是功能。要解决此问题,您可以执行以下操作。

$("#mydiv").stop().hide().fadeIn(450);