Question

以下是一个有效的例子：http://jsfiddle.net/Y8Tvu/

我有2 UL个，每个都填充LI个。当我将鼠标悬停在.nav-dayselector ul li a上时，jQuery将用于在第二个#hover-days ul li中显示相应的UL（这是必要的，因为实际代码在带有overflow:hidden的轮播中使用因此，我们需要使用2个单独的UL并以这种方式显示它们。

这很好用 - 问题是当您将鼠标悬停在弹出的span（#hover-days ul li span）上时，#hover-days ul li会淡出。（见jsFiddle example）

当鼠标超出范围时，我需要停止此fadeOut，以便您可以使用菜单并从:hover span中选择项目。

但是，使用2个单独的UL s执行此操作的任何其他方式都可以完美无缺。对jsfiddle的任何简单修复都可行吗？

Answer 1

如果你保留对元素的引用当它徘徊时，告诉它停止淡出但是这要求用户以前用鼠标指针到达它它消失了

  $(".nav-dayselector ul li a").each(function() {
    IndexLI = $(this).parent().index();
    var ele = $("#hover-days ul li:eq("+IndexLI+") span");

    $(this).hover(function() {
     ele.show();
    }, function() {
     ele.fadeOut();
    });

    ele.hover(function() {
     $(ele).stop().fadeIn();
    }, function() {
     $(ele).fadeOut();
    });
  });

html / css dosent似乎在浏览器btw（IE 8）中工作

jQuery 2级悬停导航和mouseover / mouseout

1 个答案: