jquery 判断滚动条到达了底部和顶端的方法


Posted in Javascript onApril 02, 2014
$(document).height()  //是获取整个页面的高度
$(window).height()  //是获取当前也就是浏览器所能看到的页面的那部分的高度。这个大小在你缩放浏览器窗口大小时会改变,与document是不一样的

要获取顶端,只需要获取到scrollTop()==0的时候就是顶端;

要获取底端,只要获取scrollTop()>=$(document).height()-$(window).height()  就可以知道已经滚动到底端了;

$(document).scrollTop() 获取垂直滚动的距离  即当前滚动的地方的窗口顶端到整个页面顶端的距离;
$(document).scrollLeft() 这是获取水平滚动条的距离;

例子:
$(document).scroll(function(){
    $("#lb").text($(document).scrollTop());
})
<span id="lb" style="top:100px;left:100px;position:fixed;"></span><!--一个固定的span标记 滚动时-->

Javascript 相关文章推荐
Javascript客户端脚本的设计和应用
Aug 21 Javascript
jQuery 源码分析笔记(3) Deferred机制
Jun 19 Javascript
Three.js源码阅读笔记(Object3D类)
Dec 27 Javascript
JavaScript判断密码强度(自写代码)
Sep 06 Javascript
Javascript让DEDECMS告别手写Tag
Sep 01 Javascript
深入浅析JavaScript中的scrollTop
Jul 11 Javascript
Vue.js第三天学习笔记(计算属性computed)
Dec 01 Javascript
详解微信开发中snsapi_base和snsapi_userinfo及静默授权的实现
Mar 11 Javascript
JavaScript实现图片懒加载的方法分析
Jul 05 Javascript
记录vue做微信自定义分享的一些问题
Sep 12 Javascript
原生js实现无缝轮播图效果
Jan 28 Javascript
详解TypeScript的基础类型
Feb 18 Javascript
jquery实现不同大小浏览器使用不同的css样式表的方法
Apr 02 #Javascript
jQuery瀑布流插件Wookmark使用实例
Apr 02 #Javascript
jquery删除指定的html标签并保留标签内文本内容的方法
Apr 02 #Javascript
jQuery判断div随滚动条滚动到一定位置后停止
Apr 02 #Javascript
jQuery动画效果animate和scrollTop结合使用实例
Apr 02 #Javascript
Jquery实现侧边栏跟随滚动条固定(兼容IE6)
Apr 02 #Javascript
用于deeplink的js方法(判断手机是否安装app)
Apr 02 #Javascript
You might like
thinkphp 字母函数详解T/I/N/D/M/A/R/U
2017/04/03 PHP
php写入文件不覆盖的实例讲解
2019/09/17 PHP
javascript 事件绑定问题
2011/01/01 Javascript
JS字符串累加Array不一定比字符串累加快(根据电脑配置)
2012/05/14 Javascript
JavaScript splice()方法详解
2020/09/22 Javascript
解析JavaScript中点号“.”的多义性
2013/12/02 Javascript
jquery实现select选中行、列合计示例
2014/04/25 Javascript
IE下通过a实现location.href 获取referer的值
2014/09/04 Javascript
js实现分享到随页面滚动而滑动效果的方法
2015/04/10 Javascript
BootStrap实用代码片段之一
2016/03/22 Javascript
jQuery插件实现图片轮播特效
2016/06/16 Javascript
js判断是否为空和typeof的用法(详解)
2016/10/07 Javascript
jQuery继承extend用法详解
2016/10/10 Javascript
jquery插件canvaspercent.js实现百分比圆饼效果
2017/07/18 jQuery
React/Redux应用使用Async/Await的方法
2017/11/16 Javascript
javascript中的this作用域详解
2019/07/15 Javascript
Vue.use()在new Vue() 之前使用的原因浅析
2019/08/26 Javascript
JS实现简易留言板特效
2019/12/23 Javascript
使用element-ui +Vue 解决 table 里包含表单验证的问题
2020/07/17 Javascript
React Native登录之指纹登录篇的示例代码
2020/11/03 Javascript
[01:45]DOTA2新英雄“神谕者”全方位展示
2014/11/21 DOTA
[01:53]2016完美“圣”典风云人物:Maybe专访
2016/12/05 DOTA
VTK与Python实现机械臂三维模型可视化详解
2017/12/13 Python
python 正确保留多位小数的实例
2018/07/16 Python
python中将zip压缩包转为gz.tar的方法
2018/10/18 Python
Python多线程同步---文件读写控制方法
2019/02/12 Python
Python爬虫实现验证码登录代码实例
2019/05/10 Python
matplotlib 生成的图像中无法显示中文字符的解决方法
2020/06/10 Python
Python实现JS解密并爬取某音漫客网站
2020/10/23 Python
python Pexpect模块的使用
2020/12/25 Python
详解基于canvas的视频遮罩插件
2018/01/04 HTML / CSS
Pharmacy Online中文直邮网站:澳洲大型药房
2020/06/27 全球购物
城市规划毕业生求职信
2013/10/10 职场文书
师德模范事迹材料
2014/06/03 职场文书
乡领导班子四风问题对照检查材料
2014/09/25 职场文书
公务员爱岗敬业心得体会
2016/01/25 职场文书