切換類jQuery setTimeout

我有一個按鈕，只有當它擊中某個媒體查詢時纔會出現。現在它工作正常，按鈕出現，單擊按鈕將顯示sidenav。再次點擊關閉菜單。切換類jQuery setTimeout

我的問題是這樣的 - 我有一個類與它切換，並稱爲'打開'。這使我可以使用不同的圖標來表示打開和關閉。但是我需要延遲切換類，所以圖標不會改變，直到菜單欄關閉。

$(document).ready(function() { 
     /* prepend category button */ 
     $('.side-bar').before('<div id="button"><p class="sidebar-button"> Menu </p></div>'); //insert html for menu button 

      $(".sidebar-button").click(function() { //click menu button and do.. 

       setTimeout(function(){ //i added this.. 

       $(".side-bar").slideToggle(); //toggle sidebar 
       $(this).toggleClass("open"); // toggle class on button for 'open' 
      }); 
     },5000); // other part of the seTimeout 
    });

最佳實現方法是什麼？對於這個問題的目的活生生的例子：http://jsfiddle.net/rXt39/2/

編輯

這可能幫助別人尋找類似的事情。我發現了一個解決方案在這裏：

jQuery and setTimeout

注：我最終改變下面的回答我的代碼。它現在工作完美。

來源

2012-08-17 Doidgey

使用的setTimeout只有當切換動畫設置爲一樣的超時將工作，如果一個人有更多或更少項的菜單，然後它將無法工作。這就是爲什麼你可以設置一個回調在第一個函數完成的時刻執行 – 2012-08-17 14:04:26

使用回調的菜單toggleClass圖標時，其完成

 $reference = $(this) 

     $(".side-bar").slideToggle(function(){ 
      $reference.toggleClass("open");   
     });

我在CSS中增加了一個。開類打開Word菜單黃色而擴大。

solution

來源

2012-08-17 13:45:47

當我查看源代碼中的類切換時，這沒有奏效。班級沒有被應用？如果我理解正確，我的解決方案是有缺陷的，因爲如果我的菜單有更多的項目和切換完成的時間增加，圖標將不再同步？ – Doidgey 2012-08-17 14:07:39

我剛剛添加了一個打開的類來顯示它的工作原理，當菜單項準備就緒時，菜單字將變爲黃色。是的，或多或少的項目菜單將最終不同步 – 2012-08-17 14:14:14

謝謝你好先生 – Doidgey 2012-08-17 14:18:51

切換類jQuery setTimeout

回答

相關問題