0

如果在 StackOverflow 上单击了父级,我发现了一个非常好的问题jQuery show submenu 。然后我制作了一个 jsfiddle,http://jsfiddle.net/JtAeh/4/用我的 css 和 html 进行尝试。有效!但是在我使用的 wordpress 主题中,他们有一些脚本可以推翻我的新自定义脚本。

是否可以以优雅的方式用子主题中的自定义脚本否决父主题中的脚本?

否则:如何更改此脚本:

var mobile_menu = function() {
        if( $(window).width() < 600 && $('body').hasClass('responsive') ) {            
            $( '#nav > ul, #nav .menu > ul' ).mobileMenu({
                subMenuDash : '-'
            });

            $( '#nav > ul, #nav .menu > ul' ).hide();
        }
    }
    mobile_menu();

    var show_dropdown = function()
    {        
        var options;              

        containerWidth = $('#header').width();
        marginRight = $('#nav ul.level-1 > li').css('margin-right');
        submenuWidth = $(this).find('ul.sub-menu').outerWidth();
        offsetMenuRight = $(this).position().left + submenuWidth;
        leftPos = -18;

        if ( offsetMenuRight > containerWidth )
            options = { left:leftPos - ( offsetMenuRight - containerWidth ) };    
        else
            options = {};

        $('ul.sub-menu:not(ul.sub-menu li > ul.sub-menu), ul.children:not(ul.children li > ul.children)', this).css(options).stop(true, true).fadeIn(300);    
    }

    var hide_dropdown = function()
    {                               
        $('ul.sub-menu:not(ul.sub-menu li > ul.sub-menu), ul.children:not(ul.children li > ul.children)', this).fadeOut(300);    
    }

    $('#nav ul > li').hover( show_dropdown, hide_dropdown );

到这个整洁的脚本:

$('ul li a').click(function() {
    $(this).parent().find('ul.sub-menu').toggle();
    return false;
});

?

我试图改变.hoverto.click.fadeIn(300)to.toggle但这是一个很长的镜头并且没有工作。

希望有人能够回答这个问题。

4

2 回答 2

0

您可以尝试在悬停或单击事件上删除任何其他事件处理程序(在添加您的事件之前以合适的为准:

$('ul li a').unbind('click').click(function() {
    $(this).parent().find('ul.sub-menu').toggle();
    return false;
});
于 2013-07-25T13:37:42.613 回答
0

我从主题开发人员那里得到了一些帮助。他给我发了这个脚本,它把菜单变成了点击菜单而不是悬停菜单:

var show_dropdown = function()
    {
        if( $( this ).children( 'ul').length > 0 ) {
            var options;

            containerWidth = $('#header').width();
            marginRight = $('#nav ul.level-1 > li').css('margin-right');
            submenuWidth = $(this).find('ul.sub-menu').outerWidth();
            offsetMenuRight = $(this).position().left + submenuWidth;
            leftPos = -18;

            if ( offsetMenuRight > containerWidth )
                options = { left:leftPos - ( offsetMenuRight - containerWidth ) };
            else
                options = {};

            $('ul.sub-menu:not(ul.sub-menu li > ul.sub-menu), ul.children:not(ul.children li > ul.children)', this).css(options).stop(true, true).fadeIn(300);
            return false;
        } else {
            window.location = $(this).children('a').attr('href');
        }
    }

    var hide_dropdown = function()
    {
        if( $( this ).children( 'ul').length > 0 ) {
            $('ul.sub-menu:not(ul.sub-menu li > ul.sub-menu), ul.children:not(ul.children li > ul.children)', this).fadeOut(300);
            return false;
        }
    }

    $('#nav ul > li').toggle( show_dropdown, hide_dropdown );

现在,我将尝试对其进行更多调整,以在打开另一个子菜单时隐藏子菜单...谢谢您的回答。

于 2013-07-28T12:15:49.693 回答