jQuery下拉菜单实现

jQuery dropdown menu implementation

本文关键字：实现 下拉菜单 jQuery      更新时间：2023-09-26

如何使这个（HERE）大菜单可用？

我希望子菜单-1、2和3在悬停在它们上面时也保持可见，当鼠标从它们中移出时，它们将向上滑动。

此处为代码示例。

$(".menu-1").hover(function(){
    $(".submenu1").stop().slideToggle(700);
});
$(".menu-2").hover(function(){
    $(".submenu2").stop().slideToggle(700);
});

$(".menu-3").hover(function(){
    $(".submenu3").stop().slideToggle(700);
});

我感谢你的帮助！

现场演示工作http://jsfiddle.net/LwYuz/3/

$(".menu-1").hover(function(){
    $(".submenu1").stop().slideToggle(700);
});

$(".menu-2").hover(function(){
    $(".submenu2").stop().slideToggle(700);
});

$(".menu-3").hover(function(){
    $(".submenu3").stop().slideToggle(700);
});

$(".submenu1").hover(function(){
$(".submenu1").stop().slideToggle(700);    
});
$(".submenu2").hover(function(){
$(".submenu2").stop().slideToggle(700);    
});
$(".submenu3").hover(function(){
$(".submenu3").stop().slideToggle(700);    
});

无论如何，我在评论部分的愤怒已经够了，

您可以使用jquery多类选择器。

  $(".menu-1,.submenu1").hover(function(){
    $(".submenu1").stop().slideToggle(700);
});

$(".menu-2,.submenu2").hover(function(){
    $(".submenu2").stop().slideToggle(700);
});

$(".menu-3,.submenu3").hover(function(){
    $(".submenu3").stop().slideToggle(700);
});

这是您的解决方案。。。Fiddle更新

相关文章：