获取可视区域高度赋值给div(解决document.body.clientHeight的返回值为0的问题)
设置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的问题)的更多相关文章
- js获取可视区域高度
document.body.clientWidth ==> BODY对象宽度 document.body.clientHeight ==> BODY对象高度 document.docume ...
- js获取网页屏幕可视区域高度
document.body.clientWidth ==> BODY对象宽度document.body.clientHeight ==> BODY对象高度document.document ...
- JQuery获取浏览器窗口的可视区域高度和宽度,滚动条高度
alert($(window).height()); //浏览器时下窗口可视区域高度 alert($(document).height()); //浏览器时下窗口文档的高度 alert($(docum ...
- js/jquery获取浏览器窗口可视区域高度和宽度以及滚动条高度实现代码
获取浏览器窗口的可视区域高度和宽度,滚动条高度有需要的朋友可参考一下.IE中,浏览器显示窗口大小只能以下获取: 代码如下复制代码 代码如下: document.body.offsetWidth doc ...
- jQuery中获取文档的高度、可视区域高度以及滚动条距页面顶部的高度
在写页面的时候,经常会碰到这样的情况,就是要获取文档的高度.可视区域高度或者滚动条距页面顶部的高度等情况. 但我总是有些爱搞混淆了,这里还是简单做个笔记吧,这里只限于使用jQuery来获取. 1.获取 ...
- jquery 获取浏览器窗口的可视区域高度 宽度 滚动条高
原文:http://www.open-open.com/code/view/1421827925437 alert($(window).height()); //可视区域高度 alert($(docu ...
- js获取页面高度赋值给div
<script type="text/javascript"> window.onload=function(){ map_width=document.body.cl ...
- jqury中$("#div").index($this)在setTimeoutt中返回值一直是-1的问题解决方案
今天遇到一个十分蛋疼的问题,花了我一个多小时才解决,其实十分简单,但我是新手,好了,事情是这样的: 我想让鼠标停留在某个元素一定时间再显示它隐藏的内容(不然你鼠标快速滑上滑下,反反复复,如果碰上sli ...
- 解决IDEA中自动生成返回值带final修饰的问题
修改配置文件: Editor--Code Style--Java--Code Generation--将Make generated local variables final勾选上
随机推荐
- 2-SAT 知识小结
2-SAT 问题: 有 n 个变量,每一个变量都是 bool 类型的,除了这 n 个变量以外,我们还有 m 个关系表达式,关系表达式差不多是这样的: x1 & x2 = false(注意每个表 ...
- docker 随笔记录
.docker 固定网络ip地址,启动 Docker的时候,用 --network 参数,可以指定网络类型 eg:docker run -itd --name test1 --network brid ...
- 安装 PHP 镜像
安装 PHP 镜像 方法一.通过 Dockerfile 构建 创建Dockerfile 首先,创建目录php-fpm,用于存放后面的相关东西. runoob@runoob:~$ mkdir -p ~/ ...
- OpenFOAM当中监测力和阻力系数
首先准备好我们自己的平常算例文件,本次我们以圆柱绕流的算例来说明用法 我们找到constant文件夹 打开其中的transportProperties文件 我们将其中的: nu ...
- [转] 修改sqlserver的数据库名、物理名称和逻辑文件名
转载: https://blog.csdn.net/dym0080/article/details/81017777
- 和小哥哥一起刷洛谷(8) 图论之Floyd“算法”
关于floyd floyd是一种可以计算图中所有端点之间的最短的"算法",其伪代码如下: for(所有起点i) for(所有终点j) 如果i=j: i到j最短路设为0 如果i与j相 ...
- html5中section元素详解
html5中section元素详解 一.总结 一句话总结: section元素 用来定义文章中的章节(通常应该有标题和段落内容) section元素的作用就是给内容分段,给页面分区 1.section ...
- P2P模式
P2P模式 P2P模式包含三个角色:消息队列(Queue),发送者(Sender),接收者(Receiver).每个消息都被发送到一个特定的队列,接收者从队列中获取消息.队列保留着消息,直到他们被消费 ...
- 实现本地des和aes 解密的工具
<?php $raw = file_get_contents('php://input'); if(!empty($raw)) { parse_str($raw);//解析到当前作用域 if ( ...
- 【转】禁用chrome firefox 的 WebRTC功能防止真实IP泄漏
无论是使用VPN还是其它代理方式,很多时候我们不希望暴露自己的真实IP,且一直以来我们认为VPN是安全的,所有流量都会走VPN. 但最近暴露出一个WebRTC特性,会暴露我们的真实IP.适用浏览器:c ...