動畫觸發slideToggle的.hide（）部分，但不是.show（）部分

當我在一個元素上使用.slideToggle時，它不會爲「show」事件顯示動畫，但它爲切換「隱藏」部分做動畫。動畫觸發slideToggle的.hide（）部分，但不是.show（）部分

我希望這不是一個愚蠢的問題，但我一直在四處尋找，我找不到答案。我只是在學習Jquery，所以如果我犯了一個簡單的錯誤，請原諒我。

This其他後問過類似的問題，但這些定義（幻燈片切換：動畫切換：無動畫）似乎並沒有工作。

這裏的殲小提琴：

http://jsfiddle.net/9jUNS/

感謝您抽空看看！ -Nick

來源

2011-11-15 Nick Tomlin

的問題是所產生的，因爲在其中的jQuery動畫跨度元件的方式使所述佈局採取跨度默認內嵌呈現和與絕對定位和塊佈局顯示它。

更新你的CSS以下幾點：

.demo span { 
    margin: 10px; 
    display: inline-block; 
    overflow: hidden; 
}

這應該糾正的定位和佈局，讓jQuery的正確動畫的元素。

來源

2011-11-15 22:29:47

哎呦，看起來像這也解決了它。無論答案是真正有用的，但我覺得菲爾從更全面的角度解決問題，同時，正因爲如此，作爲像我這樣的未來noobies一個更好的整體答案。 –

這個工作在編輯的jsfiddle

$(document).ready(function() {  
    $('div.demo').children('span').hide(700); 
           $('div.demo h3').click(function() { 
           $(this).next().slideToggle(700); 
           }); 

    });

看起來像你的「.hide（）」被覆蓋由的slideToggle提供的行爲。

來源

2011-11-15 22:16:09

優秀的，謝謝！所以，將來我應該爲.hide（）函數聲明一個值？ –

是的。請確保您將此標記爲答案。 –

動畫觸發slideToggle的.hide（）部分，但不是.show（）部分

回答

相關問題