的jQuery了slideDown菜單的子項

我轉換快魚響應菜單WordPress模板，並已成功地實現了基於此的jsfiddle一個版本。爲了拋光它，我想添加一個簡單的slideDown/slideUp效果，當你點擊一個項目及其子項打開（菜單的移動版本）時。

http://jsfiddle.net/badlydrawnben/c5MJy/ - 隔着那麼你看到的< 480像素版本滑動底部欄

我的代碼是

$('li.has-children').click(

    function() { 
     $(this).toggleClass("xpopdrop").siblings().removeClass('xpopdrop'); 
      });

但不過，我嘗試添加了slideDown函數在那裏，我不能讓它工作。

任何想法我錯了嗎？

感謝，本

來源

2013-07-18 badlydrawnben

所以，你要的動畫，而不是即時開/關？ – isherwood

如果你把所有的抨擊importants關閉CSS，然後你這樣做！

$('.mobnav-subarrow').click(function() { 
    $(this).parent('li').find('ul').slideToggle(); 
});

...你幾乎沒有。您需要禁用suckerfish懸停效果才能完成它。

http://jsfiddle.net/isherwood/c5MJy/4/

來源

2013-07-18 20:30:06 isherwood

那麼您正在尋找這樣的事情：

$('#mobnav-btn').click(

function() { 
    $('.sf-menu').slideToggle() 
}); 


$('.mobnav-subarrow').click(

function() { 
    var list = $(this).next(); 
    if(list.is(':visible')){ 
     $('.sf-menu ul').slideUp(); 
    }else{ 
     $('.sf-menu ul').slideUp(); 
     list.slideDown(); 
    } 
});

有CSS中的一些編輯過。不要使用！重要的是當你試圖用JavaScript來設置動畫時。（發言dispaly：塊重要;而顯示：！無重要;這是在CSS）

JsFiddle（更新）

來源

2013-07-18 20:30:48 drip

的jQuery了slideDown菜單的子項

回答

相關問題