絕對定位的子元素在父容器的動畫過程中被剪裁

Question

我創建了一個在懸停時生長的框。 盒子裏面有一個縮略圖，它是position:absolute，比父盒子大。

當我爲父容器的寬度或高度設置動畫時，縮略圖會被裁剪爲父級的大小，但僅在動畫期間裁剪。

在這裏看到一個簡單的演示（在Chrome/Safari瀏覽器/ FF測試在Mac）： http://jsfiddle.net/Q2BPx/3/

我在做什麼錯？

Answer 1

我不知道你是在做任何「錯誤的」本身。

當animate方法運行時，jQuery使用內聯樣式爲動畫的每個幀設置寬度。它還將「overflow：hidden」樣式添加到內聯樣式中。

您可以通過添加以下內容來破解擴展器的css：overflow：visible！important;

這樣可以防止內聯溢出：隱藏不起來縮小您的縮略圖。

但是，您可能需要查看jQuery代碼，以瞭解animate使用溢出設置的原因。或者，至少測試一下你的頁面，以確保你沒有通過溢出引入異常：visible！important;