如何用JS来控制div高度的自适应

JavaScript013

如何用JS来控制div高度的自适应,第1张

首先你得有个高宽比(比例),根据这个比,用js计算就是了。

function resizeHeight(id,size){

var ele = document.getElementById(id)

var width = ele.offsetWidth

ele.style.height = size*width+"px"

}

说明:id是div的id(String),size是高宽比(Number)。

调用:

resizeHeight("youId",0.5)

window.onresize = resizeHeight("youId",0.5)

这个太简单了吧,先设置父元素,overflow:hidden

收起的时候,height:0;

点开的时候 height:auto;

另外最好不要用绝对定位,这样会让布局更麻烦

哦,补充一下,如果还有爷爷级的话同样要给设置overflow:hidden

应为这样才能形成BFC(块级格式化上下文)

不然的话会撑不开