html下拉展开内容,点击下拉展开.html

Web Font Sample

/*展开收起*/

.transition {

transition: all .5s;

}

.show {

line-height: 200%;

box-sizing: border-box;

max-height: 400px; /*可以不要*/

height: 200px; /*可以不要*/

overflow: hidden;

background: lightblue;

width: 30%;

}

.fold {

max-height: 0;

}

/*箭头旋转*/

.rotate1 {

display: inline-block;

transform: rotate(180deg);

}

.rotate2 {

transform: rotate(360deg);

}

点击

三角形(假装这是一张图片)

---

$('button').click(function (event) {

$('#slider').toggleClass('fold')

$('#span').toggleClass('rotate2')

})

一键复制

编辑

Web IDE

原始数据

按行查看

历史