获取页面scroll高度
记录一下获取 scroll 高度的方法
经实际测试: document.body.scrollTop 在 chrome 下会返回0.
所以 document.documentElement.scrollTop 或者 window.pageYOffset 需要一起判断, 做一下兼容
var scrollTop = window.pageYOffset || document.documentElement.scrollTop || document.body.scrollTop;
获取视口区域的高度
var viewportSize = window.innerHeight || document.documentElement.clientHeight || document.body.clientHeight;
获取一个元素的高度(一个元素距离顶部的高度, 这个是一定的, 决定了这个元素在页面的某一个位置)
document.querySelector("selector").offsetTop
应用:
如果scroll的高度大于了元素所在位置的高度, 那么需要进行加载 (lazy load)
获取页面scroll高度的更多相关文章
- javascript 获取页面的高度及滚动条的位置的代码
http://www.jb51.net/article/23331.htm javascript 获取页面的高度及滚动条的位置的代码 作者: 字体:[增加 减小] 类型:转载 javascript ...
- document.documentElement.clientHeight 和 $(window).height() 无法正确获取页面可视区高度
背景: 弹出层插件(自适应) 实现过程中突然发现在获取可视区高度时,无论document.documentElement.clientHeight 还是 $(window).height()都无法正确 ...
- js获取页面宽度高度及屏幕分辨率
网页可见区域宽:document.body.clientWidth 网页可见区域高:document.body.clientHeight 网页可见区域宽:document.body.offsetWid ...
- javascript获取页面各种高度
网页可见区域宽: document.body.clientWidth网页可见区域高: document.body.clientHeight网页可见区域宽: document.body.offsetWi ...
- JavaScript获取页面宽度高度
网页可见区域宽:document.body.clientWidth网页可见区域高:document.body.clientHeight网页可见区域宽:document.body.offsetWidth ...
- js 和 jquery 获取页面和滚动条的高度 视口高度文档高度
js 和 jquery 获取页面和滚动条的高度 //页面位置及窗口大小 function GetPageSize() { var scrW, scrH; if(window.innerHeight & ...
- js获取页面高度赋值给div
<script type="text/javascript"> window.onload=function(){ map_width=document.body.cl ...
- jquery获取文档高度和窗口高度的例子
jquery获取文档高度和窗口高度,$(document).height().$(window).height() $(document).height():整个网页的文档高度 $(window).h ...
- jquery获取页面相关尺寸
$(windows).width();获取页面可视宽度 $(windows).height();获取页面可视高度 $(document).height();获取页面内容的总高度 $(document) ...
随机推荐
- MyCat - 数据库中间插件
什么是MyCat 是目前最流行的分布式数据库中间插件 为什么使用MyCat 如今随着互联网的发展,数据的量级也是撑指数的增长,从GB到TB到PB.对数据的各种操作也是愈加的困难,传统的关系性数据库已经 ...
- js数据类型及变量知识(一)
1.js中基本数据类型有哪些? 基本数据类型: undefined.number.string.boolean.null.[object] object[引用数据类型] ...
- js原型链的看法
原型链 对象 对象: 1,函数对象:由function创造出来的函数 2,普通对象:除开函数对象之外的对象,都是普通对象 **即普通对象obj是构造函数Object的一个实例,因此: obj.__pr ...
- Node.js实现用户评论社区(体验前后端开发的乐趣)
前面 接着上一节的内容来,今天我们要完成一个用Node开发后台服务器,实现一个简单的用户评论社区.可以先看下效果图: 开始 建立项目文件夹comment-list,在里面新建一个public文件夹,p ...
- Java 之 设计模式——代理模式
设计模式——代理模式 一.概述 1.代理模式 (1)真实对象:被代理的对象 (2)代理对象:代理真实对象的 (3)代理模式:代理对象代理真实对象,达到增强真实对象功能的目的 二.实现方式 1.静态代理 ...
- 【转】【Salesforce】salesforce 零基础学习(十七)Trigger用法
看本篇之前可以相应阅读以下Trigger相关文章: 1.https://developer.salesforce.com/page/Trigger_Frameworks_and_Apex_Trigge ...
- 2647673 - HANA Installation Failure with signal 11 core dumped
Symptom HANA 2.0 SPS03 installation using hdblcmgui failed due to the below error message. [Error] / ...
- 使用TP5验证器遇到的坑
项目中需要对字段进行验证,本人使用的是控制器验证方式.话不多说,直接上报错信息: SQLSTATE[42S02]: Base table or view not found: 1146 Table ' ...
- Eclipse不支持tomcat8_compiler编译级别选不到1.8
-------------------------------------------------------------- Eclipse不支持tomcat8 如果你要使用tomcat8.0+版本的 ...
- pandas之数据处理
首先,数据加载 pandas提供了一些用于将表格型数据读取为DataFrame对象的函数,期中read_csv和read_table这两个使用最多. 1.删除重复元素 使用duplicated()函数 ...