js获取不同浏览器盒子宽度高度
DTD
已声明
IE
document.documentElement.scrollHeight
浏览器所有内容高
度
,document.body.scrollHeight
浏览器所有内容高度
document.documentElement.scrollTop
浏览器滚动部分高度,
document.body.scrollTop
始终为
0
document.documentElement.clientHeight
浏览器可视部分高度,
document.body.clientHeight
浏览器所有内容高度
FF
document.documentElement.scrollHeight
浏览器所有内容高
度
,document.body.scrollHeight
浏览器所有内容高度
document.documentElement.scrollTop
浏览器滚动部分高度,
document.body.scrollTop
始终为
0
document.documentElement.clientHeight
浏览器可视部分高度,
document.body.clientHeight
浏览器所有内容高度
Chrome
document.documentElement.scrollHeight
浏览器所有内容高度,
document.body.scrollHeight
浏览器所有内容高度
document.documentElement.scrollTop
始终为
0
,
document.body.scrollTop
浏览器滚动部分高度
document.documentElement.clientHeight
浏览器可视部分高度,
document.body.clientHeight
浏览器所有内容高度
DTD
未声明
IE
document.documentElement.scrollHeight
浏览器可视部分高度,
document.body.scrollHeight
浏览器所有内容高度
document.documentElement.scrollTop
始终为
0
,
document.body.scrollTop
浏览器滚动部分高度
document.documentElement.clientHeight
始终为
0
,
document.body.clientHeight
浏览器可视部分高度
FF
document.documentElement.scrollHeight
浏览器可视部分高度
,
document.body.scrollHeight
浏览器所有内容高度
document.documentElement.scrollTop
始终为
0
,
document.body.scrollTop
浏览器滚动部分高度
document.documentElement.clientHeight
浏览器所有内容高度,
document.body.clientHeight
浏览器可视部分高度
Chrome
document.documentElement.scrollHeight
浏览器可视部分高
度
,document.body.scrollHeight
浏览器所有内容高度
document.documentElement.scrollTop
始终为
0
,
document.body.scrollTop
浏览器滚动部分高度
document.documentElement.clientHeight
浏览器所有内容高度,
document.body.clientHeight
浏览器可视部分高度
浏览器所有内容高度即浏览器整个框架的高度,
包括滚动条卷去部分
+
可视部分
+
底部隐藏部分的高度总和
浏览器滚动部分高度即滚动条卷去部分高度即可视顶端距离整个对象顶端的高
度。
综上
1
、
document.documentElement.scrollTop
和
document.body.scrollTop
始终有
一个为
0
,所以可以用这两个的和来求
scrollTop
2
、
scrollHeight
、
clientHeight
在
DTD
已声明的情况下用
documentElement
,
未声明的情况下用
body
3
、
document.documentElement.scrollTop
在未声明的情况下始终为
0
,所以可
以用来判断是否声明了
DTD;
所以,
判断滚动条
是否已拉到页面最底部,可以用如下代码
window.onscroll = function (){
var marginBot = 0;
if (document.documentElement.scrollTop){
marginBot = document.documentElement.scrollHeight
–
(document.documentElement.scrollTop+document.body.scrollTop)-document
.documentElement.clientHeight;
} else {
marginBot = document.body.scrollHeight
–
document.body.scrollTop- document.body.clientHeight;
}
if(marginBot<=0) {
//do something
}
}
js获取不同浏览器盒子宽度高度的更多相关文章
- JS获取屏幕,浏览器窗口大小,网页高度宽度(实现代码)_javascript技巧_
JS获取屏幕,浏览器窗口大小,网页高度宽度(实现代码)_javascript技巧_--HTML5中文学习网 http://www.html5cn.com.cn/shili/javascripts/79 ...
- Js获取字符串的显示宽度/高度
重点:1.在H5页面,文字大小单位为rem2.不同的font-family,文字的宽度不一样3.文字宽度同时受font-size和font-family影响 思路:在页面动态创建一个节点,设置节点的f ...
- JS获取当前浏览器的类型
<script type=“text/javascript”> function isIE(){return navigator.appName.indexOf(“Microsoft In ...
- js 获取浏览器/网页宽度高度整理
网页宽度.高度: 网页可见区域宽: document.body.clientWidth 网页可见区域高: document.body.clientHeight 网页可见区域宽: document.bo ...
- JS获取图片的原始宽度和高度
页面中的img元素,想要获取它的原始尺寸,以宽度为例,可能首先想到的是元素的innerWidth属性,或者jQuery中的width()方法.如下: <img id="img" ...
- JS获取各种浏览器窗口大小的方法
常用:JS 获取浏览器窗口大小复制代码 代码如下:// 获取窗口宽度if (window.innerWidth)winWidth = window.innerWidth;else if ((docum ...
- jq 获取各个元素的宽度高度的方法
JS获取各种宽度.高度的简单介绍: scrollHeight: 获取对象的滚动高度. scrollLeft:设置或获取位于对象左边界和窗口中目前可见内容的最左端之间的距离 scrollTop:设置或获 ...
- js获取网页屏幕可视区域高度
document.body.clientWidth ==> BODY对象宽度document.body.clientHeight ==> BODY对象高度document.document ...
- js获取网页屏幕可见区域高度
document.body.clientWidth ==> BODY对象宽度 document.body.clientHeight ==> BODY对象高度 document.docume ...
随机推荐
- jQuery EasyUI的使用入门
jQuery EasyUI不是什么太高级的东西,就是用jQuery写了很多方法.定义了很多属性,通过调用这些方法.属性,可以达到一些特定的效果,然后我们再根据具体需求微调就好了.至少需要导入两个样式表 ...
- Docker 安装及问题处理
1 确定Linux版本 uname -r 2 升级系统(添加 APT 镜像源,添加使用 HTTPS 传输的软件包以及 CA 证书.) sudo apt-get update sudo apt-get ...
- IP地址接口小结
1 百度http://api.map.baidu.com/location/ip?ak=F454f8a5efe5e577997931cc01de3974&ip=58.67.143.169 {& ...
- hbase伪分布
1.编辑 conf/hbase-env.sh来告知HBase java的安装路径.在这个文件里你还可以设置HBase的运行环境,诸如 heapsize和其他 JVM有关的选项, 还有Log文件地址,等 ...
- 基于Debian系统配置Nginx环境的Node.js应用教程
Node.js,是当前比较流行的能够动态的快速响应内容的JavaScript框架,在有些环境下比我们使用的PHP应用都能够提高效率.目 前,Node.js可以与我们常用的Nginx.Apache等服务 ...
- Linux增加swap分区大小
1. 查看当前分区情况 free -m 2. 增加 swap 大小, 2G 左右 dd if=/dev/zero of=/var/swap bs=1024 count=2048000 3. 设置交换文 ...
- Node.js:全局对象
概要:本篇博客主要介绍了node.js中的全局对象. 在JavaScript中,通常window是全局对象,而node.js中的全局对象是global,所有全局变量(除了global本身之外)都是gl ...
- 认识System,System32,Syswow64
有时候人们怀疑一个系统的底层结构能否保证这个系统在被使用时达到安全而高效,64位版本的Windows在这方面就比较完美.Windows XP和Windows Server 2003都是运行64位硬件的 ...
- 二维离散平稳小波分解swt2
对信号X进行N尺度平稳小波分解 [A,H,V,D]=swt2(X,N,'wname'); clc,clear all,close all; load woman; [cA,cH,cV,cD]=swt2 ...
- Python之线程&进程
线程: 线程是操作系统能够进行运算调度的最小单位.它被包含在进程之中,是进程中的实际运作单位.一条线程指的是进程中一个单一顺序的控制流,一个进程中可以并发多个线程,每条线程并行执行不同的任务. thr ...