判断页面是否滚动到底部
来源:互联网 发布:java 精确毫秒后6位 编辑:程序博客网 时间:2024/05/24 06:50
var isPageBottom=function () {
var scrollTop = 0;
var clientHeight = 0;
var scrollHeight = 0;
if (document.documentElement && document.documentElement.scrollTop) {
scrollTop = document.documentElement.scrollTop;
} else if (document.body) {
scrollTop = document.body.scrollTop;
}
if (document.body.clientHeight && document.documentElement.clientHeight) {
clientHeight = (document.body.clientHeight < document.documentElement.clientHeight) ? document.body.clientHeight: document.documentElement.clientHeight;
} else {
clientHeight = (document.body.clientHeight > document.documentElement.clientHeight) ? document.body.clientHeight: document.documentElement.clientHeight;
}
// 知识点:Math.max 比较大小,取最大值返回
scrollHeight = Math.max(document.body.scrollHeight, document.documentElement.scrollHeight);
if (scrollTop + clientHeight+633 >= scrollHeight) {
return true;
} else {
return false;
}
}
isPageBottom()
函数解释
var scrollTop = 0;
var clientHeight = 0;
var scrollHeight = 0;
if (document.documentElement && document.documentElement.scrollTop) {
scrollTop = document.documentElement.scrollTop;
} else if (document.body) {
scrollTop = document.body.scrollTop;
}
if (document.body.clientHeight && document.documentElement.clientHeight) {
clientHeight = (document.body.clientHeight < document.documentElement.clientHeight) ? document.body.clientHeight: document.documentElement.clientHeight;
} else {
clientHeight = (document.body.clientHeight > document.documentElement.clientHeight) ? document.body.clientHeight: document.documentElement.clientHeight;
}
// 知识点:Math.max 比较大小,取最大值返回
scrollHeight = Math.max(document.body.scrollHeight, document.documentElement.scrollHeight);
if (scrollTop + clientHeight+633 >= scrollHeight) {
return true;
} else {
return false;
}
}
isPageBottom()
函数解释
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;}
0 0
- 判断页面是否滚动到底部
- 判断滚动条是否到达页面底部
- 判断ScrollView是否滚动到底部
- 判断RecyclerView是否滚动到底部
- RecyclerView如何判断是否滚动到底部
- js判断滚动条是否到底部
- 判断滚动条是否到底部
- 移动端滚动加载数据判断是否滚动到页面底部
- jq判断滚动条到页面底部
- [Js]判断iframe内的页面是否滚动到底部触发事件
- js判断滚动条是否已到页面最底部或顶部实例
- jquery 判断div滚动条是否滚动到底部
- js判断滚动条是否已到页面最底部或顶部实例-拓展(逐渐-自动下滑滚动)
- jquery判断页面滚动条(scroll)是上滚还是下滚,且是否滚动到头部或者底部
- jquery判断页面滚动条(scroll)是上滚还是下滚,且是否滚动到头部或者底部
- jquery判断页面滚动条(scroll)是上滚还是下滚,且是否滚动到头部或者底部
- js判断html页面是否滚动到了最底部
- 判断滚动滚动到底部
- 微信小程序完整开发,看这篇文章就够了
- python2-3.26
- asp.net使用ado连接数据库
- 1013. 数素数 (20)
- Java代理模式(cglib代理)
- 判断页面是否滚动到底部
- 比较offsetX, pageX,clientX,screenX的区别
- ASP横向输出和纵向输出PDF
- 扩展欧几里德算法 递归和非递归实现及证明
- Arduino教程汇总贴
- Java实现字符串大小写的转换并倒序输出
- 互联网广告系统综述一生态圈
- 前端面试题小探(1)
- 第三方邮箱登录126,163等服务器配置STMP