切換按鈕淡入/淡出效果 - jquery

Question

所以我有一個列表，我將逐一淡化每個UL元素。像這樣，

$j(function(){ 
$j('#access-navi .sub').click(function(){ 
    $j(this).find('ul li a').each(function(i){ 
    $j(this).delay(i*150).fadeIn(500); 
    }); 
}); 
}); 

本工程以diplay他們，但是當我試圖讓這個當我在按鈕上再次點擊，它不會做任何事情。

$j(function(){ 
$j('#access-navi .sub').click(function(){ 
    $j(this).find('ul li a').each(function(i){ 
    $j(this).delay(i*150).fadeToggle(500); 
    }); 
}); 
}); 

我試圖將其更改爲這一點，但是，這並不工作..

如何作出這樣的淡入也淡出後第2個點擊的按鈕。

HTML：

<div id="access-navi" role="navigation"> 
    <ul> 
    <li><a href="">Home</a></li> 
    <li class="sub"><a href="#">Code</a> 
    <ul> 
     <li><a href="">Html.Css</a></li> 
     <li><a href="">Java</a></li> 
     <li><a href="">jQuery</a></li> 
     <li><a href="">Php</a></li> 
    </ul> 
    </li> 
    </ul> 
    <div class="clear"></div> 
    </div> 

Answer 1

我相信你想這樣的事情。 toggle功能接受兩個或更多的函數作爲參數，並在點擊時交替地執行函數。因此，首先單擊它淡入，第二點擊淡出，第三點擊淡入，第四點擊了，等

$j(function(){ 
    $j('#access-navi .sub').toggle(function(){ 
     $j(this).find('ul li a').each(function(i){ 
      $j(this).delay(i*150).fadeIn(500); 
     }); 
    }, function() { 
     $j(this).find('ul li a').each(function(i){ 
      $j(this).delay(i*150).fadeOut(500); 
     }); 
    }); 
});