设置html,body{height:100%}
在使用html5文档类型的时候, 设置了html body的高度100%之后,两个浏览器就都能获取document.body.clientHeight了
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>弹出层自定义(自动获取高度)</title>
<script type="text/javascript" src="js/jquery-1.11.0.js"></script>
<style type="text/css">
*{margin: 0;padding: 0;}
.Load{width:100%; background-color: rgba(221,221,221,0.5);}
.LoadDiv{margin: auto; text-align: center;vertical-align: middle;position: absolute;top: 50%; left: 50%;}
</style>
<script type="text/javascript">
$(document).ready(function () {
window.onload = function () {
getHeight();//调用函数
};
function getHeight() {
var Load = document.getElementById('Load');//获取Load的高度
var body_height = document.documentElement.clientHeight;//document.body.clientHeight中在<!DOCTYPE html>声明下会返回0
alert(body_height);
Load.style.height = body_height + 'px';//将正文的高度赋值给Load
}
});
</script>
</head>
<body>
<div class="Load" id="Load">
<div class="LoadDiv">
<img src="layer/theme/default/loading-0.gif"/>
</div>
</div>
</body>
</html>