js获取窗口滚动条高度、窗口可视范围高度、文档实际内容高度、滚动条离浏览器底部的高度
1.获取窗口可视范围的高度
//获取窗口可视范围的高度
function getClientHeight(){
var clientHeight=0;
if(document.body.clientHeight&&document.documentElement.clientHeight){
var clientHeight=(document.body.clientHeight<document.documentElement.clientHeight)?document.body.clientHeight:document.documentElement.clientHeight;
}else{
var clientHeight=(document.body.clientHeight>document.documentElement.clientHeight)?document.body.clientHeight:document.documentElement.clientHeight;
}
return clientHeight;
}
2.获取窗口滚动条高度
function getScrollTop(){
var scrollTop=0;
if(document.documentElement&&document.documentElement.scrollTop){
scrollTop=document.documentElement.scrollTop;
}else if(document.body){
scrollTop=document.body.scrollTop;
}
return scrollTop;
}
3.获取文档内容实际高度
function getScrollHeight(){
return Math.max(document.body.scrollHeight,document.documentElement.scrollHeight);
}
4.使用方法
window.onscroll=function(){
// 窗口可视范围的高度
var height=getClientHeight(),
// 窗口滚动条高度
theight=getScrollTop(),
// 窗口可视范围的高度
rheight=getScrollHeight(),
// 滚动条距离底部的高度
bheight=rheight-theight-height; document.getElementById('show').innerHTML='此时浏览器可见区域高度为:'+height+'<br />此时文档内容实际高度为:'+rheight+'<br />此时滚动条距离顶部的高度为:'+theight+'<br />此时滚动条距离底部的高度为:'+bheight;
}
js获取窗口滚动条高度、窗口可视范围高度、文档实际内容高度、滚动条离浏览器底部的高度的更多相关文章
- JS获取/设置iframe内对象元素、文档的几种方法
1.IE专用(通过frames索引形象定位): document.frames[i].document.getElementById('元素的ID'); 2.IE专用(通过iframe名称形象定位): ...
- pdf.js实现在HTML下直接浏览pdf文档,无需插件即可实现
近期,有一个朋友做B端,服务器存了大量的金融类数据,很多都是pdf文档,他现在的做法是,先将pdf文档转换成flash,再放到浏览器上给用户浏览,但是他告诉我,这种体验太差了,而且很好资源,空间已经快 ...
- PyQt5复杂控件(树控件、选项卡控件(滚动条控件、多文档控件、停靠控件)
1.树控件的基本使用方法QTreeWidget'''QTreeWidget树控件的使用方法添加图标,添加表格,添加复选框等'''from PyQt5.QtWidgets import *from Py ...
- JS魔法堂:精确判断IE的文档模式by特征嗅探
一.前言 苦逼的前端攻城狮都深受浏览器兼容之苦,再完成每一项功能前都要左顾右盼,生怕浏览器不支持某个API,生怕原生API内含臭虫因此判断浏览器类型和版本号成了不可绕过的一道关卡,而特征嗅探是继浏览器 ...
- Java获取XML节点总结之读取XML文档节点
dom4j是Java的XML API,用来读写XML文件的.目前有很多场景中使用dom4j来读写xml的.要使用dom4j开发,需要下载导入dom4j相应的jar文件.官网下载:http://www. ...
- JavaScript获取IE版本号与HTML设置ie文档模式
JavaScript获取IE版本代码: var gIE = getIE(); alert(gIE.version) function getIE() { var rmsie = /(msie) ([\ ...
- js获取或设置当前窗口url参数
直接上代码 // 获取当前窗口url中param参数的值 function get_param(param){ var query = location.search.substring(1).spl ...
- EasyPlayer.js网页全终端播放器安装使用文档
EasyPlayer.js 集 rtmp, hls, flv, websocket 于一身的网页直播/点播播放器, 使用简单, 功能强大 属性(Property) video-url 视频流地址 St ...
- 在Linux系统上获取命令帮助信息和划分man文档
使用历史命令history 打完以后前面会有顺序号的比如1 cd2 ls3 pwd如果需要重新执行cd命令则可以执行 !3 命令 命令补全功能 比如你要执行history命令 可以打上histo+键 ...
随机推荐
- 【深度优先搜索】NOIP2017_D2T1 洛谷3958奶酪
这道题的写法大体有两种:大法师DFS和并查集,两种算法都不难,本篇博客主要讲解DFS,而且测试数据特水,连个剪枝都不用都可以过. 题目描述[luogu传送门] 现有一块大奶酪,它的高度为 h,它的长度 ...
- 郁金香指标开源库的使用--(tulipindicators-0.8.4)
瞎逛发现最新出了这么一个指标库,有100多种指标的函数库,文档写的比较好,重要的是作者一直在维护. 把它编成库,然后测试一下,可用于自动交易,策略交易等开发. 1.下载地址 https://githu ...
- 20155212 ch02 课下作业
20155212 ch02 课下作业 T1 题目 参考附图代码,编写一个程序 "week0601学号.c",判断一下你的电脑是大端还是小端 相关知识 小端法:最低有效字节在最前面 ...
- 2017-2018-1 20155307 《信息安全系统设计基础》第san周学习总结
2017-2018-1 20155307 <信息安全系统设计基础>第三周学习总结 教材学习内容总结 无符号数和有符号数的特性,数字如何表示,IEEE标准,浮点数格式.(我感觉我把课下测试做 ...
- WPF设置ListBoxItem失去焦点时的背景色
<!--全局ListBoxItem--> <Style TargetType="ListBoxItem"> <Style.Resources> ...
- 【BZOJ4803】逆欧拉函数
[BZOJ4803]逆欧拉函数 题面 bzoj 题解 题目是给定你\(\varphi(n)\)要求前\(k\)小的\(n\). 设\(n=\prod_{i=1}^k{p_i}^{c_i}\) 则\(\ ...
- 解决老项目中 Timer运行一段时间后失效的问题
那是因为Timer中的代码出现了异常未被捕获,所以线程被挂起 只需要加入 try catch即可 推荐使用 Quartz 2018-08-08 03:50:44 [ Timer-1:39366015 ...
- 【mysql优化】mysql count(*)、count(1)、count(主键字段)、count(非主键字段)哪个性能最佳
测试结果为:count(*)和count(1)基本相等,count(非主键字段)最耗性能 -- 数据量 708254select count(*) from tmp_test1;-- avg 0.22 ...
- 查看Linux系统版本的命令
1.lsb_release -a,即可列出所有版本信息: [root@S-CentOS ~]# lsb_release -a LSB Version: :base-4.0-amd64:base-4.0 ...
- python学习-linux基本操作
1.sudo 管理员root身份 2.mkdir 创建文件夹 touch 创建文件 3.rm 删除 4.chmod 赋予权限 r(读取):4 w(写):2 x(执行):1 rwx=7,r-x=5等 ...