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)
修改div高度,可以直接给div的width赋值即可。
下面是小例子,仅供参考:
<style type='text/css'>#div2 {
width:200px
height:200px
background:red
border:1px solid black
}
</style>
<script>
function toGreen(){
var oDiv=document.getElementById('div2')
oDiv.style.width='300px'
oDiv.style.height='300px'
oDiv.style.background='green'
}
</script>
<body>
<div id='div2' onmouseover='toGreen()' >
</div>
首先设置两个div,假设给出id分别为a和b,b始终为a的宽度的二分之一。js代码为:
var diva=document.getElementById("a")
var divb=document.getElementById("b")
var wid=diva.offsetWidth
function jt(){//定义监听a大小变化的函数
var wid1=diva.offsetWidth//获取宽度
if(wid1!=wid){
wid=wid1
resizeb()
}
setTimeout("jt",100)
}
function resizeb(){
divb.style.width=wid*0.5//改变b的大小
}
jt()
但是这样写是在不知道a的大小为什么变化的情况下,这样写很耗cpu,如果很明确a的大小变化原因,直接给a绑定事件就可以了