延遲和動畫切換jquery

Question

我想玩arround，我完全是新手jquery！所以，我需要一些幫助definetly :)

$(function() { 
     $('#switch').on('click', function() { 
      $('#customOverlay').toggle(); 
     }); 
    }); 

我做了一個光開關，我試圖通過增加customOverlay開啓/關閉燈。

它工作得很好，但不像預期的那樣。我想將它延遲1000毫秒，並且我想通過這種方式對它進行動畫處理，只是將視線開啓和關閉的速度非常快。這是可能的原因，我甚至不能推遲它，我不知道如何動畫切換。

預先感謝您！

Answer 1

嘗試.fadeToggle()：

$(function() { 
     $('#switch').on('click', function() { 
      $('#customOverlay').delay(1000).fadeToggle(); 
     }); 
}); 

OR

$(function() { 
     $('#switch').on('click', function() { 
      $('#customOverlay').fadeToggle(1000); 
     }); 
}); 

只使用.delay()和.toggle不會起作用，因爲.delay()僅適用於其他的答案動畫和.toggle()不動畫，而.fadeToggle()呢。

Answer 2

嘗試使用.delay()

$('#customOverlay').delay(1000).fadeToggle();