如果窗口中的語句調整大小，使jQuery重新運行。

我有以下代碼：如果窗口中的語句調整大小，使jQuery重新運行。

$(document).ready(function(){ 
var widwith = $(window).width(); 
    if(widwith < 1150) { 
     $('.menu-item-has-children').click(function(){ 
      $('.sub-menu').toggleClass('sub-display'); 
     }); 
    }else if(widwith > 1150) { 
     $('.menu-item-has-children').hover(function(){ 
      $('.sub-menu').toggleClass('sub-display'); 
     }); 
    } 
});

它檢測窗口寬度，並且根據該寬度使得一個子菜單apear在任點擊（移動）或懸停在桌面上。我遇到的問題是，如果您調整窗口大小，我不需要重新運行if語句，以防跨越1150像素寬度的閾值......但我不知道如何做到這一點？任何想法？

來源

2014-10-29 Shout It Web Solutions

jQuery(document).ready(function(){ 
    jQuery(window).resize(function() { 
     resize(); 
    }); 
    resize(); 
}); 

function resize() 
{ 
    var widwith = jQuery(window).width(); 
    if(widwith < 1150) { 
     jQuery('.menu-item-has-children').click(function(){ 
      jQuery('.sub-menu').toggleClass('sub-display'); 
     }); 
    }else if(widwith > 1150) { 
     jQuery'.menu-item-has-children').hover(function(){ 
      jQuery('.sub-menu').toggleClass('sub-display'); 
     }); 
    } 
}

只需添加一個窗口調整處理。

來源

2014-10-29 00:23:58 TGH

我會把它放在$（document）.ready中嗎，還是那樣變得沒有必要？ – 2014-10-29 00:25:52

你可以在裏面定義它，以確保當你連接dom的時候dom已經準備好了 – TGH 2014-10-29 00:26:37

nope ...不工作...它停止工作的代碼的其餘部分...我使用jQuery（document ）。就緒（函數（$）{}）;語法，因爲即時通訊與wordpress工作......會有所作爲？ – 2014-10-29 00:34:46

您可以使用jQuery的resize方法

$(window).resize(function() { 
    // put yout code here 
});

來源

2014-10-29 00:23:45

你快到了。首先，你需要核心resize事件邏輯拉成一個單獨的功能，這樣你就可以重新使用：

function resize() { 
    var widwith = $(window).width(); 
    if(widwith < 1150) { 
     $('.menu-item-has-children').click(function(){ 
       $('.sub-menu').toggleClass('sub-display'); 
     }); 
    }else if(widwith > 1150) { 
     $('.menu-item-has-children').hover(function(){ 
       $('.sub-menu').toggleClass('sub-display'); 
      }); 
    } 
}

這將使你在準備監聽文件看起來像這樣：

jQuery(document).ready(function() { 
    resize(); 
});

然後添加事件監聽器的大小調整事件：

jQuery(window).resize(function() { 
    resize(); 
});

應該這樣做。

來源

2014-10-29 00:28:30

不工作....會有一些事情與jQuery（document）.ready（function（$）{}）;由於WordPress而使用的語法？ – 2014-10-29 00:36:25

是的，將$改爲jQuery以使用ready和resize處理程序 – 2014-10-29 00:39:05

如果窗口中的語句調整大小，使jQuery重新運行。

回答

相關問題