设置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. LoadRunner学习目录

    已更新: 未更新: 1.loadrunner 11破解版及破解包 2.如何录制一个LR脚本 3.自定义loadrunner脚本

  2. Python 的特性

    Copyright © 1999-2019, CSDN.NET, All Rights Reserved     原 python面试题整理(一) 崔先生的博客阅读数:2402018-08-03 前言 ...

  3. 用vue做todolist

    <template> <div class="hello"> <div style="height:25px;line-height:25p ...

  4. avalon怎么让重叠的图片改变显示层级?

    <span style="display: inline-block;width:20%;"> <span style="display: inline ...

  5. OpenFOAM清理计算结果(只保留原始的0,system,constant)

    原视频下载地址:https://yunpan.cn/cMpyLZq8sWQgq(提取码:a08b)

  6. fluent meshing导入二维网格

    meshing导入二维网格"> fluent meshing只能在Dimension为3D时才能使用 meshing导入二维网格"> 其实也可以导入二维网格,具体操作见 ...

  7. ubuntu之路——day11.5 迁移学习

    在深度学习领域中,最强力的理念之一就是可以将神经网络学习的一种知识应用到另一个独立的任务中. 看上面的例子,首先我们有一个已经完成训练的神经网络,其目标是图像识别,我们有了绿色的1000000张图片并 ...

  8. Python flask模块接口开发学习总结

    引言 Flask 是一个简单且十分强大的Python web 框架.它被称为微框架,“微”并不是意味着把整个Web应用放入到一个Python文件,微框架中的“微”是指Flask旨在保持代码简洁且易于扩 ...

  9. PluginWindowlessWin

    实际绘图发生在我的本机代码中的屏幕外目标上,每次刷新都会调用myplugin :: onWindowRefresh,它会将StretchBlt调用到插件的无窗口窗口,代码如下, FB::PluginW ...

  10. KS(Kolmogorov-Smirnov)值

    KS(Kolmogorov-Smirnov)值越大,表示模型能够将正.负客户区分开的程度越大.KS值的取值范围是[0,1] ks越大,表示计算预测值的模型区分好坏用户的能力越强. ks值 含义 > ...