jQuery slideUp（）不縮小填充底部值

Question

在this fiddle中，您會注意到當您單擊其中一個按鈕時，容器將緩慢向上滑動。當它到達頂部時，你會發現它並沒有完全滑動。如果你看着檢查員，li的底部填充不會像你期望的那樣在slideUp()操作中縮小。

任何想法爲什麼？

注意：向上滑動很慢以更好地顯示問題。

注2：當我將jQuery庫更改爲1.7.2時，它實際上可以正常工作。有趣。

FWIW：我提交了ticket使用jQuery

Answer 1

編輯：

這個迴歸固定在jQuery的1.8.1 - fiddle。

---

正如你已經注意到的，這是v1.8.0中的另一個bug。

這fiddle表明paddingBottom簡單地在slideUp的動畫的最後減去。細微的paddingBottom減法在您的小提琴上不可見，因爲當您在回撥內部撥打slideDown時，paddingBottom會立即加回（對比減去它的方式）。 Fiddle

如果您不希望等到修復程序被釋放並且不想降級到1.7.2，臨時解決方法使其表現爲1.7.2，則會將CSS屬性圖傳遞給.animate：

function next() { 
    var q = $(this).parents('li'); 
    q.data('originalDimensions', { 
     borderTopWidth: q.css('borderTopWidth'), 
     paddingTop: q.css('paddingTop'), 
     height: q.css('height'), 
     paddingBottom: q.css('paddingBottom'), 
     borderBottomWidth: q.css('borderBottomWidth') 
    }); 
    q.animate({ borderTopWidth:0, paddingTop:0, height:0, paddingBottom:0, borderBottomWidth:0 }, 5000, function(){ 
     $(this).animate($(this).data('originalDimensions'), 5000); 
    }); 
} 

Fiddle

讓我們投了你的票，並希望它被固定在1.8.1版本。

編輯：更新了變通方法來存儲元素的.data()的originalDimensions，這樣就可以在以後的時間，並在不同的範圍內使用。要一次動畫多個元素，使用.each迭代設置.data()：

q.each(function() { 
    var $this = $(this); 
    $this.data('originalDimensions', { 
     borderTopWidth: $this.css('borderTopWidth'), 
     //... 
    }); 
}); 
q.animate({ borderTopWidth:0, /*...*/ }, 5000, function() { 
    $(this).animate($(this).data('originalDimensions'), 5000); 
}); 

Fiddle