Question

我正在尝试使用弹出式菜单（浮动DIV内部）。使它们显示onmouseover属性是没有问题的，但我不确定如何正确关闭菜单。

我正在使用<map>处理已映射到其上的链接的图像。我希望人们在悬停在链接上时看到一个菜单。

我认为知道何时关闭菜单的最佳方法是等到鼠标不再悬停在调用菜单或菜单本身的HTML元素上，然后等待一秒钟，然后关闭菜单。

我的想法是否可以通过一些jQuery实现？或者是否有更好，更有效的替代方案？

Answer 1

我会在jQuery hoverIntent插件后面提出建议。应该快速启动并运行，非常易于配置，无需滚动自己的代码。

Answer 2

使用jquery：

$("your-menu-button-selector, your-menu-selector").bind("mouseleave", function(e){
  clearTimeout($(this).data("mouseleaveTimeout"));
  $(this).data("mouseleaveTimeout", setTimeout(function(){
     //your code
     //closeMenu();
  }, 1000)); //one second
});

您还想在打开菜单时清除超时！

$("your-menu-button-selector, your-menu-selector").bind("mouseenter", function(e){
  clearTimeout($(this).data("mouseleaveTimeout"));
  //your code
  //openMenu()
});

我现在明白了，你也可以在链接和菜单框中使用相同的东西，这样当悬停选项时，它不会消失。

Answer 3

我自己做了一些额外的挖掘工作。 http://javascript-array.com/scripts/jquery_simple_drop_down_menu/

我需要以某种方式将它与<map>结合起来，使图像的某些部分调用一个下拉菜单。你认为这可以完成工作吗？

如何知道何时需要关闭下拉菜单

3 个答案: