javascript - 怎么做才能点击显示内容部分？

Question

http://phplist.xxmn.com/menu.html

当鼠标悬停在导航 ( cpanel) 上时。它显示了它下面的相应内容。但我无法单击其中的链接。有没有办法得到它。我知道它将使用 setTimeout。但我不知道该怎么做。谢谢你。

当我更改top值 small.but 在 IE7 和 IE6 下。我仍然无法单击显示内容中的链接。

Answer 1

不是好方法，但对你有用，更好的方法：使用 css top = 20px：

var timeout;

$(function(){ // = document.ready
    $("#nav ul li").hover(function() {
        $(this).find(".sub-menu").show();
        clearTimeout(timeout);
    }, function() {

        var timeout = setTimeout(function(){
            $(this).find(".sub-menu").hide();
        },1000); // 1000 = 1 second
    });
});

Answer 2

您应该将内容 div 放在更靠近、更好的菜单元素旁边，并更改它的出现和消失方式。在菜单mouseover上显示它，在内容上mouseout隐藏它。我认为这将是最简单的方法。

Answer 3

$(document).ready(function () {    
    $("#nav ul li").on('mouseenter', function () {
        $('#nav ul li').find(".sub-menu").hide();
        $(this).find(".sub-menu").show();
    });

    $('.sub-menu').on('mouseleave click', function () {
        $(this).hide();
    });
});