負荷的jQuery - 在調整大小和頁面加載

我想使用一些jQuery的，但只能在小屏幕上，如移動，以及當用戶改變瀏覽器。如果我使用resize函數，代碼只能在調整大小的情況下工作，如果我自己使用代碼，它只能在頁面加載時工作，如何組合這兩者？（我使用的CSS類，而不是檢查窗口大小以我的條件，我發現它工作得更好）負荷的jQuery - 在調整大小和頁面加載

$(window).resize(function(){  
    if ($(".sampleClass").css("float") == "none"){ 
     $('#nav').slideToggle(); 
    } 
});

也有小問題，當切換是在這個有條件的話，它不斷地模擬並沒有按」你想停下來。如果我只是放置它沒有條件和調整功能，它就像一個魅力。我在這裏錯過了什麼？

if ($(".sampleClass").css("float") == "none"){ 
     $('#nav').slideToggle(); 
    }

來源

2015-02-05 yennefer

'$（window）.on（「load resize」，function（）{// do stuff}）'？ – guest271314 2015-02-05 14:29:29

謝謝，這看似相同，節省了大量的空間:)我有與調整大小切換問題，但 - 如果我調整窗口二，三次，點擊菜單鍵（例如.smapleclass以上），那麼它停止工作完全地，如果我調整到全寬並回到小移動大小，那麼它有時會再次起作用。可能是什麼問題？ – yennefer 2015-02-05 16:51:16

由於guest271314在他們的意見建議，您可以在您的來電on指定事件名稱的空格分隔的列表附加一個事件處理多個事件。 http://api.jquery.com/on/

就重複動畫而言，您的動畫實際上可能會調整文檔視圖的大小（因爲它將內容滑入和滑出視圖），這會觸發另一個調整大小事件，從而觸發另一個動畫，等等。

如果是這樣的話，無論是調整佈局和動畫，使得slideToggle()調用不會調整您的內容，或考慮另一種解決方案。

來源

2015-02-05 16:00:08 Palpatim

我開始只用'toggle'，而不是'slideToggle'這似乎更好地工作，但現在我意識到另一個問題： - 如果我調整窗口二，三次，每次點擊菜單鍵（例如.smapleclass以上），以切換導航然後它完全停止工作，如果我調整到全寬並回到小移動大小，那麼它有時會再次起作用。可能是什麼問題？ – yennefer 2015-02-05 16:54:43

這些類型的問題通常是由於您每次調用方法的順序略有不同，因爲它們依賴於異步事件的計時。除非你明確地通過回調或承諾來設置它，否則你需要在代碼中努力不要假設特定的調用順序。 – Palpatim 2015-02-05 22:17:51

我會兩次調用該函數： - 當DOM滿載 - 調整大小功能

裏面關於動畫問題：只需調用一個新的函數resize事件結束後，如500毫秒後。

$(function(){ 

    if ($(".sampleClass").css("float") == "none"){ 
     $('#nav').slideToggle(); 
    } 

    var myVar; 
    function myNewFunction(){ 
     if ($(".sampleClass").css("float") == "none"){ 
      $('#nav').slideToggle(); 
     } 
    } 

    window.onresize = function() { 
     clearTimeout(myVar); 
     myVar = setTimeout(function() { 
      myNewFunction(); 
     }, 500); 
    }; 
});

來源

2015-02-05 16:33:37

負荷的jQuery - 在調整大小和頁面加載

回答

相關問題