经常会碰到文本详情展开和收起,需要overflow:hidden;配合height:auto;来使用
通常容器规定了宽高,超过部分用overflow:hidden;隐藏,当添加height:auto的时候height值和overflow失效
具体例子如下:
html
<p class=“heigthAuto”>如果给定一个表示 DOM 元素集合的 jQuery 对</p>
<a>展开</a>
css
p{width:200px;height:54px;overflow:hidden}
.heightAuto{height:auto}
js
$(function () {
$("a").on('click', function () {
if ($(this).prev().hasClass("heightAuto")) {
$(this).text("收起");
$(this).prev().removeClass("heightAuto")
} else {
$(this).text("展开");
$(this).prev().addClass("heightAuto")
}
})
})