Question

---原始悬停代码---

function bind_dropdown() {
    $('div#quick_nav div.search_dropdown').on('hover', function() {
        var thisid = $(this).attr('id').split('_');
        var this_action = thisid[1];
        var this_width = 950;
        var add_class = 'dropdown_full';

        if(this_action == 4) {
            this_width = 200;
            add_class = 'dropdown_small';
        }

        if($('div#quick_nav div#dropdown_'+escape(this_action)).is(':visible')) {
            $('div#quick_nav div#dropdown_'+escape(this_action)).addClass(add_class).slideUp(100);
        }
        else{
            $('div#quick_nav div.dropdown').hide();
            $('div#quick_nav div#dropdown_'+escape(this_action)).addClass(add_class).slideDown(100).width(this_width);
        }
        return false;
    });
}

---结束原始代码---

我确实尝试将鼠标悬停更改为点击。但它可以关闭菜单，您现在必须再次单击菜单图标。任何帮助将不胜感激。我希望能够点击显示菜单，当鼠标离开菜单时，它会自动关闭。

提前谢谢

Ĵ

Answer 1

使用以下代码

function bind_dropdown() {
    $('div#quick_nav div.search_dropdown').on('click', function() {
        var thisid = $(this).attr('id').split('_');
        var this_action = thisid[1];
        var this_width = 950;
        var add_class = 'dropdown_full';

        if(this_action == 4) {
            this_width = 200;
            add_class = 'dropdown_small';
        }

        if($('div#quick_nav div#dropdown_'+escape(this_action)).is(':visible')) {
            $('div#quick_nav div#dropdown_'+escape(this_action)).addClass(add_class).slideUp(100);
        }
        return false;
    }).on("mouseleave", function() {
        var thisid = $(this).attr('id').split('_');
        var this_action = thisid[1];
        var this_width = 950;
        var add_class = 'dropdown_full';

        if(this_action == 4) {
            this_width = 200;
            add_class = 'dropdown_small';
        }
        $('div#quick_nav div.dropdown').hide();
        $('div#quick_nav div#dropdown_'+escape(this_action)).addClass(add_class).slideDown(100).width(this_width);
    });
}

需要帮助更改菜单从悬停到点击

1 个答案: