如何实现CSS+JS一个DIV层的展开折叠效果

html-css027

如何实现CSS+JS一个DIV层的展开折叠效果,第1张

可以改变 "div" 元素的高度(jQuery的animate方法)：

$(".btn1").click(function(){

  $("#box").animate({height:"300px"})

})

也可以设置溢出隐藏：

<div style="min-height:10pxoverflow:hidden">

    <div style="margin-top:-800px">content more..</div>

</div>

第二种方式也需要js动态改变div style里面的margin-top。

利用伪类可以实现点击打开折叠菜单，但是再次点击收起貌似就没法实现了。跟楼下说的一样，利用:hover、:active 可以设置二级菜单的样式（如height、visibility、display）以达到展开的效果。