2010-07-31 56 views
1

請你能幫助jQuery初學者嗎?我真的不知道如何繼續...jquery動畫菜單:如何獲得活動狀態

我做了一個jquery動畫菜單:look at this。內容用ajax加載,所以沒有真正的頁面加載。

現在我必須做活動項目的一部分。給被點擊的項目類「上」,我這樣做:「上」有

$navig.click(function() { 
    $(this).addClass("on"); 
    $navig.not(this).removeClass("on"); 
}) 

與類項目:

  • 動畫到激活狀態(類似於鼠標懸停狀態)並保持這個
  • 其他項目有動畫回到正常狀態(當類「」被刪除)
  • 如果你點擊一個子項,父項具有動畫到激活狀態

任何想法如何解決?

回答

1

你可以利用`的:動畫「選擇

$navig.click(function() { 
    // turn on current item and animate to blablabla 
    $(this).addClass("on").animate({blablabla}); 
    // turn off others and animate back 
    $navig.not(this).removeClass("on").filter(':animated').stop().animate({blablabla}); 
}); 
+0

謝謝,它解決了這個問題。不知道:生氣蓬勃的東西。 我最後一個問題是,如何給父類的「on」類,當你點擊它的子(subNav)時,有什麼想法? – Thomas 2010-07-31 16:59:32

0

你可以用CSS動畫得到的地方,像這樣:

.menuitem { transition: all 1s ease-in-out; } 

支持,現在不是很好,我很確定。對於基於WebKit的瀏覽器它的工作原理,但與

-webkit-transition 

屬性而不是transition。也許對其他瀏覽器也有類似的支持。

+0

是的,我知道這css3功能。但不幸的是它必須適用於所有瀏覽器......感謝Grumdrig – Thomas 2010-07-31 17:02:35