一 .效果
22.gif
二.解决办法
1.将想隐藏的div的height设为0px (此时那些文字都出来了...怎么办！！？接着看)
2.用overflow="hidden" 来把出来的部分全都隐藏
三.具体代码
- html部分
<a href="#" onclick="open_payDetails()">订单详情</a>
- css部分
.pay-details{
background-color: #F9F9F9;
transition: all 0.5s ease-in-out;
height: 0px;
overflow: hidden;
}
- js部分
//打开订单详情
function open_payDetails(){
console.log($(".pay-details").css("height"));
if($(".pay-details").css("height")=="0px"){
$(".pay-details").css("height","160px");
}
else{
$(".pay-details").css("height","0px");
}
}
网友评论