0

不确定我是否做对了，但我正在尝试在 jQuery 中创建一个简单的下拉菜单。一旦菜单项悬停在上面，我基本上希望出现一个 div（带链接）。

菜单：

<ul id="mainlevel">
  <li><a href="#" class="mainlevel_home" ><span>Home</span></a></li>
  <li><a href="#" class="mainlevel_feature-writers" ><span>Feature Writers</span></a></li>
  <li><a href="#" class="mainlevel_fantasy-killed-my-hsc" ><span>Fantasy Killed My HSC</span></a></li>
</ul>

隐藏的分区：

<div class="subMenu"><a href="/feature-writers/jd-ormsby" class="sublevel jd-ormsby"><span>J.D. Ormsby</span></a></div>

jQuery：

$(".mainlevel_feature-writers").hover(function(){ 
  $(".subMenu").fadeIn("slow"); 
}, function() { 
  $(".subMenu").fadeOut("slow"); 
});

现在，这会在隐藏的 div 中淡出并很好地淡出，但是 - 如果有人将鼠标悬停在新显示的 div 内的某个东西上，我该如何阻止它淡出？

对不起，如果这是一个非常明显的问题..我还在学习！:)

4

1 回答 1

1

我认为您需要将处理mouseover和mouseout事件分开。

据推测，您希望将mouseover处理程序附加到“顶级”菜单元素，并将mouseout处理程序附加到隐藏的“下拉”div（使用一些状态代码来管理冲突）。

于 2009-07-18T14:13:58.887 回答