取決於窗口大小的動作jQuery

我試圖根據窗口大小觸發向上/向下滑動，但即使條件爲false（窗口大於800），它仍會執行此操作。這是我的代碼：取決於窗口大小的動作jQuery

$(document).ready(function(){ 

    if ($(window).width() <= 800) { 
     $('nav ul').hide(); 
     $("#navBarMobile").click(function() { 
      $("nav ul").slideToggle("slow"); 
     }); 
    } 
    else { 
     $('nav ul').show(); 
    } 
})

來源

2014-02-20 Miguel

這對我來說很好：http://jsfiddle.net/K6qkV/1/ –

不幸的是，當瀏覽器寬度大於800時，ul仍然處於切換狀態 – Jesse

窗口寬度的值是相對於它放置的容器innerWidth。如果你正試圖獲得瀏覽器的寬度和檢測量後進行調整，這將是一個可行的辦法：

if (window.outerWidth <= 800) {

在我提供有一個註釋部分的小提琴。當此部分未被評論時，這也將有助於檢測何時發生調整大小，這將允許元素更動態地運行。

小提琴：http://jsfiddle.net/xLUQg/

更新： 小提琴無評論：http://jsfiddle.net/t57Qk/

我希望這有助於。

來源

2014-02-20 17:47:13 Jesse

這很有道理，但問題是，當我點擊'#navBarMobile'，同時窗口<= 800，調整窗口大於800'導航ul'隱藏 – Miguel

是的。除非您取消註釋我在答覆中所述的2段代碼。否則，該腳本不會知道您調整了窗口大小。 – Jesse

謝謝，它的工作原理！ – Miguel

取決於窗口大小的動作jQuery

回答

相關問題