暫時調整懸停時元素的高度

Question

我有一個<h3>標記，高度有限（例如100像素，位置：絕對），文本溢出。

我想要做的是將其滑動到鼠標懸停並返回原始高度（100px）所需的高度。
我希望你明白我的意思

我不認爲它使用slidedown（）函數，我在動畫函數中很弱。請幫忙嗎？

Answer 1

您可以在包含內容的h3中嵌套div，然後使用h3作爲遮罩容器（使用overflow：hidden）。當用戶鼠標懸停時，觸發一個獲得內部div高度的函數（確保包含任何邊距或填充）。然後執行你的高度調整動畫功能（在jquery中，類似$('h3').animate({height: heightVar});）mouseout會觸發一個函數，將h3的高度恢復爲100px。

這裏有一個例子：http://jsfiddle.net/XR9fb/

Answer 2

你可以用scrollHeight財產元素的實際高度。現在，我並不十分了解jQuery，但我想你可以調用animate將鼠標懸停在元素上的高度CSS屬性設置爲元素的scrollHeight，並且在鼠標移出時返回原始高度它。

如果元素的高度不固定，您可以在顯示完整元素之前在某個位置提供當前高度，並且當鼠標離開元素時，您只需恢復此狀態。