0

当我从菜单中移除鼠标指针的那一刻,它全部消失了,我觉得这很烦人。我想稍微延迟一下,以便当我不小心滑出菜单时菜单更宽容,或者可能使用 hoverIntent。问题是,无论我用谷歌搜索多少,我都找不到任何地方有足够我理解的指南。当谈到 javascripting 时,我是一个真正的新手。:)

我在 scripts.js 下找到了这个,我认为它是控制菜单悬停属性的编程:

// STARTS MEGA MENU
var temp, menu = jQuery("#navigation .menu");
menu.find("li").hover(function(){
    jQuery(this).children('.children').hide().slideDown('normal');
    if(jQuery(this).hasClass('mega-item'))
        jQuery(this).children('.children').find('.children').hide().slideDown('normal');
    try{
        $tmp=(jQuery(this).children('.children').offset().left+jQuery(this).children('.children').width())-(jQuery("#header .twelve").offset().left+jQuery("#header .twelve").width());
        if($tmp>0){
            jQuery(this).children('.children').css("right","0");
        }
    }
    catch(e){}
},function(){
    jQuery(this).children('.children').stop(true,true).hide();
}); 

menu.children("li").each(function(){
    temp = jQuery(this);
    if(temp.children().hasClass("children"))
        temp.addClass("showdropdown");

    if(temp.hasClass('rel'))
        temp.find('.children').append('<span class="mg-menu-tip" style="width:'+temp.width()+'px"></span>');
    else
        temp.find('.children').append('<span class="mg-menu-tip" style="left:'+(temp.position().left-20)+'px;width:'+temp.width()+'px"></span>');
});


menu.find(".children.columns").each(function(){
    $countItems=1;
    jQuery(this).children(".mega-item").each(function(){
        temp = jQuery(this);
        if(temp.hasClass("clearleft")){
            $countItems=4;
        }else if(($countItems%3)==1 && $countItems!=1){
            temp.addClass("clearleft");
        }
        $countItems++;
    });
});
$i = 0;
menu.find(">li>ul.children").each(function(){
    jQuery(this).find('>li>ul.children').parent().find('>a>span').addClass('menu-span-arrow').html('â–º');
});
menu.find("ul.children>li").hover(function(){
    jQuery(this).children("ul.children").css('left', (jQuery(this).width()-5)+"px");       
});
// END MEGA MENU

如果这可能是一个相当具体的问题,我很抱歉,但是每次我尝试从其他人的问题中实现某些东西时,我的网站都会崩溃:P

提前致谢!

编辑: 我在functions.php下注册了hoverIntent

wp_register_script('hoverIntent2', get_template_directory_uri() . '/js/jquery.hoverIntent.js');

稍后被 wp_enqueue_script('hoverIntent2');

4

1 回答 1

0

Sooo 我请我的朋友帮助我,大约一个小时后,这就是我们最终的结果(我很高兴:)):

// STARTS MEGA MENU
var temp, menu = jQuery("#navigation .menu");
var menu_show = false;
var menu_timeout;
var menu_object;

menu.find("li").not('.mega-item').hover(function(){
    jQuery(this).children('.children').hide().slideDown('normal');
    if(jQuery(this).hasClass('mega-item'))
        jQuery(this).children('.children').find('.children').hide().slideDown('normal');
    try{
        $tmp=(jQuery(this).children('.children').offset().left+jQuery(this).children('.children').width())-(jQuery("#header .twelve").offset().left+jQuery("#header .twelve").width());
        if($tmp>0){
            jQuery(this).children('.children').css("right","0");
        }
    }
    catch(e){}
},function(){
    jQuery(this).children('.children').stop(true,true).hide();
}); 

jQuery('#menu-item-2462').hover(function(){

    clearTimeout(menu_timeout);

    menu_object = jQuery(this).children('.children');

    if(!menu_show) {
        menu_show = true;

        jQuery(this).children('.children').hide().show();
        if(jQuery(this).hasClass('mega-item'))
            jQuery(this).children('.children').find('.children').hide().show();
        try{
            $tmp=(jQuery(this).children('.children').offset().left+jQuery(this).children('.children').width())-(jQuery("#header .twelve").offset().left+jQuery("#header .twelve").width());
            if($tmp>0){
                jQuery(this).children('.children').css("right","0");
            }
        } catch (e) {}
    }
},function(){

    menu_timeout    = setTimeout(function() { menu_object.stop(true,true).hide(); menu_show = false;} , 500);



}); 



menu.children("li").each(function(){
    temp = jQuery(this);
    if(temp.children().hasClass("children"))
        temp.addClass("showdropdown");

    if(temp.hasClass('rel'))
        temp.find('.children').append('<span class="mg-menu-tip" style="width:'+temp.width()+'px"></span>');
    else
        temp.find('.children').append('<span class="mg-menu-tip" style="left:'+(temp.position().left-20)+'px;width:'+temp.width()+'px"></span>');
});


menu.find(".children.columns").each(function(){
    $countItems=1;
    jQuery(this).children(".mega-item").each(function(){
        temp = jQuery(this);
        if(temp.hasClass("clearleft")){
            $countItems=4;
        }else if(($countItems%3)==1 && $countItems!=1){
            temp.addClass("clearleft");
        }
        $countItems++;
    });
});
$i = 0;
menu.find(">li>ul.children").each(function(){
    jQuery(this).find('>li>ul.children').parent().find('>a>span').addClass('menu-span-arrow').html('►');
});
menu.find("ul.children>li").hover(function(){
    jQuery(this).children("ul.children").css('left', (jQuery(this).width()-5)+"px");       
});
// END MEGA MENU

我希望这对某人有帮助!此致 :)

于 2013-11-17T19:49:37.313 回答