我想将元素的div高度设置为浏览器的innerHeight.我不希望在这里发生css或jQuery.它必须通过窗口大小调整动态地改变它的高度.所以我制作了这个剧本,它不像我想的那样工作.
这是我的代码:
window.onload=
window.onresize=function(){
var left = document.getElementById("left");
var height = window.innerHeight;
left.style.height = 'height +('px')';
}
Run Code Online (Sandbox Code Playgroud)
有人可以纠正我的代码并使其工作.任何帮助将不胜感激.
谢谢.
您可以添加height:500px;到左侧元素.看看我想要什么.但我需要适应浏览器的高度.
解决了
//<![CDATA[
function resize()
{
var heights = window.innerHeight;
document.getElementById("left").style.height = heights -50 + "px";
}
resize();
window.onresize = function() {
resize();
};
//]]>
Run Code Online (Sandbox Code Playgroud)
感谢Thirumalai murugan的回答.
fxd*_*xdx 15
它可以用CSS3完成:
只需使用Viewport-Percentage Lengths设置div高度
div {
height:100vh;
}
Run Code Online (Sandbox Code Playgroud)
Thi*_*gan 14
我发现的问题window.load可能是在DOM元素创建之前被解雇了,你可以删除html,bodycss但是会给一些余量html,body,如果你不想使用css应该在javascript中处理,#leftcss规则仅用于理解div高度
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<title>Thirumalai-Window size</title>
<style type="text/css">
#left{width:200px;background:red;}
#inner{height:100%;overflow-y:scroll;}
html,body{margin: 0px;}
</style>
</head>
<body>
<div id="left"></div>
<script type="text/javascript">//<![CDATA[
function resize()
{
var heights = window.innerHeight;
document.getElementById("left").style.height = heights + "px";
}
resize();
window.onresize = function() {
resize();
};
//]]>
</script>
</body>
</html>
Run Code Online (Sandbox Code Playgroud)
| 归档时间: |
|
| 查看次数: |
42177 次 |
| 最近记录: |