如何防止菜单显示在满载之前?

时间:2014-02-06 23:51:15

标签: javascript jquery

晚上好,有没有办法在点击或刷新后如何防止在嵌套侧边菜单中显示所有元素。我需要的只是在菜单或子菜单中显示我点击的元素?网站:link。非常感谢你。

Jquery的:

if (window.location.href.indexOf('http://www.odsavacky.cz/blog/wpcproduct/') != -1 ){
        $('.arrows_list1-1 li ul').hide();
        var prev_url = document.referrer;
        var $current = $('.arrows_list1-1 li a[href="' + prev_url + '"]');
        $current.parents('.sub-menu').show();
        $current.next('.sub-menu').show();    
    }else if(window.location.href.indexOf('/page/') != -1){
        $('.arrows_list1-1 li ul').hide();
        var page_url = window.location.href.split("/").slice(0,5).join("/");
        page_url = page_url + "/";
        var $current = $('.arrows_list1-1 li a[href="' + page_url + '"]');
        $current.parents('.sub-menu').show();
        $current.next('.sub-menu').show();    
    }else{  
        $('.arrows_list1-1 li ul').hide();
        $('.arrows_list1-1 li').click(function(ev) {
            $(this).find('>ul').show();
            ev.stopPropagation();
        });

        var url = window.location.href;
        var $current = $('.arrows_list1-1 li a[href="' + url + '"]');
        $current.parents('.sub-menu').show();
        $current.next('.sub-menu').show();
    }

1 个答案:

答案 0 :(得分:1)

有几种方法可以做到这一点。但我可以建议你使用这个:

将此css添加到您的信息页

body:not(.loaded) ul.sub-menu
{
  display:none;
}

然后在执行完所有菜单代码后,添加:

$('body').addClass('loaded');

它将隐藏子菜单,直到整个脚本执行完毕;

<强>升级

我不明白你是如何根据页面网址知道要显示哪些ul元素的,但你知道(对吗?)。

再次使用你的逻辑创建一个css规则,只计算你想要隐藏的内容,并在页面加载之前附加这个css。

在您上次<ul>之后添加以下内容:

<script>
/** FIRST, use your magic to get the li element thats currently selected **/
var currentlySelectedItem = $('.arrows_list1-1 li a[href="' + MAGIC MAGIC + '"]');
var alwaysShowThisGuy = $currentlySelectedItem.parent().parent(); //Should return a <ul>

//Now the css
style = document.createElement('style');
style.innerHTML = "
    body:not(.loaded) ul.sub-menu:not(#"+ $alwaysShowThisGuy.id +")
    {
      display:none;
    }
";
style.type = 'text/css';

document.getElementsByTagName('head')[0].appendChild(style);
</script>

邪恶的巫术吧?!