需要幫助編輯響應菜單的JavaScript文件

有人可以幫我編輯下面的腳本嗎？響應式菜單正在工作，但我希望在單擊「link1」或「link2」時讓菜單的移動版本崩潰。需要幫助編輯響應菜單的JavaScript文件

============================================== ========== 這是腳本：

$(function() { 
    var pull  = $('#pull'); 
     menu  = $('#nav-bar ul'); 
     menuHeight = menu.height(); 

    $(pull).on('click', function(e) { 
     e.preventDefault(); 
     menu.slideToggle(); 
    }); 

    $(window).resize(function(){ 
     var w = $(window).width(); 
     if(w > 320 && menu.is(':hidden')) { 
      menu.removeAttr('style'); 
     } 
    }); 
});

=========================== ============================= 導航欄HTML：

<div id="nav-bar" class="clearfix"> 
<ul class="clearfix"> 
    <li><a href="#link1">LINK1</a></li> 
    <li><a href="#link2">LINK2</a></li> 
</ul> 
<a href="#" id="pull">MENU</a> 
</div>

========== ============================================== CSS：

 /* Clearfix */ 
.clearfix:before, 
.clearfix:after { 
    content: " "; 
    display: table; 
} 

.clearfix:after { 
    clear: both; 
} 

.clearfix { 
*zoom: 1; 
} 

#nav-bar { 
    height: 65px; 
    position: fixed; 
    width: 100%; 
    z-index: 100; 
} 

#nav-bar ul { 
    height: 65px; 
    margin: 0 auto; 
    width: 940px; 
} 

#nav-bar li { 
    display: inline; 
    float: left; 
} 

#nav-bar a { 
    display: inline-block; 
    line-height: 65px; 
} 


#nav-bar a:hover, 
#nav-bar a:active, 
.active { 
    background-color: #343434; 
    box-shadow: 0 3px 8px #2d2d2d inset; 
} 

#nav-bar a#pull { 
    display: none; 
}

來源

2013-09-11 user2671507

「Pull」不必要地包裝在jQuery對象中兩次。另外，是否有一個原因菜單和menuHeight是全局變量？這會在嚴格模式下失敗，因爲它可能會導致意外的行爲。有沒有媒體查詢處理這個問題的原因？ – Swordfish0321

對不起，忘了包含媒體查詢。我認爲菜單的樣式是正確的，但調整大小不同的屏幕等等。移動菜單單擊時展開，但不會在單擊鏈接時摺疊。你能幫忙編輯劇本嗎？我無法得到下面的建議工作。 – user2671507

$("#nav-bar ul li a").on("click", function(e){ 
    e.preventDefault(); 
    menu.slideUp(); 
});

來源

2013-09-11 03:19:02 Conqueror

不知道在哪裏，嘗試了許多不同的方式，但無法使其工作。 – user2671507

需要幫助編輯響應菜單的JavaScript文件

回答

相關問題