Question

我如何压缩这个jQuery下拉菜单代码？我知道你可以使用Superfish插件，但我更感兴趣的是学习这方面的编程技巧。我知道这会涉及将“#navabout”ID更改为类似“＃Nav1”和匹配的下拉ID，比如“＃drop1”，然后运行数组，可能吗？

    $('#navabout').hover(
    function () {
        $('#dropabout').show();
    },
    function () {
        $('#dropabout').hide();
});

$('#navnews').hover(
    function () {
        $('#dropnews').show();
    },
    function () {
        $('#dropnews').hide();
});

$('#navgroups').hover(
    function () {
        $('#dropgroups').show();
    },
    function () {
        $('#dropgroups').hide();
});

$('#navemployee').hover(
    function () {
        $('#dropemployee').show();
    },
    function () {
        $('#dropemployee').hide();
});

$('#navtools').hover(
    function () {
        $('#droptools').show();
    },
    function () {
        $('#droptools').hide();
});

Answer 1

为所有菜单分配“菜单”类。

然后做

$('.yourClass').hover(
    function () {
        $(this).show();
    },
    function () {
        $(this).hide();
});

Answer 2

您可以在没有JavaScript的情况下处理此问题。如果菜单运行的是“Suckerfish”样式，并且您不需要在IE6上下拉，那么您需要使用的是:hover。

#menu li:hover ul { 
    left: auto;
}

压缩jQuery下拉菜单代码

2 个答案: