在悬停时暂时调整元素的高度

Question

我有一个<h3>标签，其高度有限（例如100 px，position：absolute），文本溢出。

我想要做的是将鼠标滑到它上面所需的高度，然后再回到原始高度（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，并返回到原始高度时鼠标移出它。

如果元素的高度没有固定，你可以在显示完整元素之前在某处显示当前高度，当鼠标离开元素时，你只需恢复这个状态。