设置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>

获取可视区域高度赋值给div(解决document.body.clientHeight的返回值为0的问题)的更多相关文章

  1. js获取可视区域高度

    document.body.clientWidth ==> BODY对象宽度 document.body.clientHeight ==> BODY对象高度 document.docume ...

  2. js获取网页屏幕可视区域高度

    document.body.clientWidth ==> BODY对象宽度document.body.clientHeight ==> BODY对象高度document.document ...

  3. JQuery获取浏览器窗口的可视区域高度和宽度,滚动条高度

    alert($(window).height()); //浏览器时下窗口可视区域高度 alert($(document).height()); //浏览器时下窗口文档的高度 alert($(docum ...

  4. js/jquery获取浏览器窗口可视区域高度和宽度以及滚动条高度实现代码

    获取浏览器窗口的可视区域高度和宽度,滚动条高度有需要的朋友可参考一下.IE中,浏览器显示窗口大小只能以下获取: 代码如下复制代码 代码如下: document.body.offsetWidth doc ...

  5. jQuery中获取文档的高度、可视区域高度以及滚动条距页面顶部的高度

    在写页面的时候,经常会碰到这样的情况,就是要获取文档的高度.可视区域高度或者滚动条距页面顶部的高度等情况. 但我总是有些爱搞混淆了,这里还是简单做个笔记吧,这里只限于使用jQuery来获取. 1.获取 ...

  6. jquery 获取浏览器窗口的可视区域高度 宽度 滚动条高

    原文:http://www.open-open.com/code/view/1421827925437 alert($(window).height()); //可视区域高度 alert($(docu ...

  7. js获取页面高度赋值给div

    <script type="text/javascript"> window.onload=function(){ map_width=document.body.cl ...

  8. jqury中$("#div").index($this)在setTimeoutt中返回值一直是-1的问题解决方案

    今天遇到一个十分蛋疼的问题,花了我一个多小时才解决,其实十分简单,但我是新手,好了,事情是这样的: 我想让鼠标停留在某个元素一定时间再显示它隐藏的内容(不然你鼠标快速滑上滑下,反反复复,如果碰上sli ...

  9. 解决IDEA中自动生成返回值带final修饰的问题

    修改配置文件: Editor--Code Style--Java--Code Generation--将Make generated local variables final勾选上

随机推荐

  1. 2-SAT 知识小结

    2-SAT 问题: 有 n 个变量,每一个变量都是 bool 类型的,除了这 n 个变量以外,我们还有 m 个关系表达式,关系表达式差不多是这样的: x1 & x2 = false(注意每个表 ...

  2. docker 随笔记录

    .docker 固定网络ip地址,启动 Docker的时候,用 --network 参数,可以指定网络类型 eg:docker run -itd --name test1 --network brid ...

  3. 安装 PHP 镜像

    安装 PHP 镜像 方法一.通过 Dockerfile 构建 创建Dockerfile 首先,创建目录php-fpm,用于存放后面的相关东西. runoob@runoob:~$ mkdir -p ~/ ...

  4. OpenFOAM当中监测力和阻力系数

    首先准备好我们自己的平常算例文件,本次我们以圆柱绕流的算例来说明用法 我们找到constant文件夹 打开其中的transportProperties文件 我们将其中的: nu             ...

  5. [转] 修改sqlserver的数据库名、物理名称和逻辑文件名

    转载: https://blog.csdn.net/dym0080/article/details/81017777

  6. 和小哥哥一起刷洛谷(8) 图论之Floyd“算法”

    关于floyd floyd是一种可以计算图中所有端点之间的最短的"算法",其伪代码如下: for(所有起点i) for(所有终点j) 如果i=j: i到j最短路设为0 如果i与j相 ...

  7. html5中section元素详解

    html5中section元素详解 一.总结 一句话总结: section元素 用来定义文章中的章节(通常应该有标题和段落内容) section元素的作用就是给内容分段,给页面分区 1.section ...

  8. P2P模式

    P2P模式 P2P模式包含三个角色:消息队列(Queue),发送者(Sender),接收者(Receiver).每个消息都被发送到一个特定的队列,接收者从队列中获取消息.队列保留着消息,直到他们被消费 ...

  9. 实现本地des和aes 解密的工具

    <?php $raw = file_get_contents('php://input'); if(!empty($raw)) { parse_str($raw);//解析到当前作用域 if ( ...

  10. 【转】禁用chrome firefox 的 WebRTC功能防止真实IP泄漏

    无论是使用VPN还是其它代理方式,很多时候我们不希望暴露自己的真实IP,且一直以来我们认为VPN是安全的,所有流量都会走VPN. 但最近暴露出一个WebRTC特性,会暴露我们的真实IP.适用浏览器:c ...