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 相关文章推荐
jQuery页面图片伴随滚动条逐渐显示的小例子
Mar 21 Javascript
JQuery+CSS提示框实现思路及代码(纯手工打造)
May 07 Javascript
框架页面高度自动刷新的Javascript脚本
Nov 01 Javascript
jQuery aminate方法定位到页面具体位置
Dec 26 Javascript
JavaScript 开发工具webstrom使用指南
Dec 09 Javascript
jQuery仿天猫实现超炫的加入购物车
May 04 Javascript
CSS图片响应式 垂直水平居中
Aug 14 Javascript
Vuex之理解state的用法实例
Apr 19 Javascript
详解vue mint-ui源码解析之loadmore组件
Oct 11 Javascript
利用Javascript开发一个二维周视图日历
Dec 14 Javascript
详解Vue webapp项目通过HBulider打包原生APP
Jun 29 Javascript
详解element-ui 表单校验 Rules 配置 常用黑科技
Jul 11 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
DC这些乐高系列动画电影你看过几部?
2020/04/09 欧美动漫
PHP 函数学习简单小结
2010/07/08 PHP
PHP实现将textarea的值根据回车换行拆分至数组
2015/06/10 PHP
PHP标准类(stdclass)用法示例
2016/09/28 PHP
使用PHP开发留言板功能
2019/11/19 PHP
IE中直接运行显示当前网页中的图片 推荐
2006/08/31 Javascript
url 特殊字符 传递参数解决方法
2010/01/01 Javascript
jQuery学习笔记之jQuery.fn.init()的参数分析
2014/06/09 Javascript
jQuery实现数秒后自动提交form的方法
2015/03/05 Javascript
jQuery取得iframe中元素的常用方法详解
2016/01/14 Javascript
javascript轮播图算法
2016/10/21 Javascript
Bootstrap 表单验证formValidation 实现远程验证功能
2017/05/17 Javascript
Form表单上传文件(type=&quot;file&quot;)的使用
2017/08/03 Javascript
bootstrap table表格客户端分页实例
2017/08/07 Javascript
js数组方法reduce经典用法代码分享
2018/01/07 Javascript
jquery+ajaxform+springboot控件实现数据更新功能
2018/01/22 jQuery
基于webpack.config.js 参数详解
2018/03/20 Javascript
小程序云开发获取不到数据库记录的解决方法
2019/05/18 Javascript
在elementui中Notification组件添加点击事件实例
2020/11/11 Javascript
pydev使用wxpython找不到路径的解决方法
2013/02/10 Python
在Linux中通过Python脚本访问mdb数据库的方法
2015/05/06 Python
TensorFlow saver指定变量的存取
2018/03/10 Python
cmd运行python文件时对结果进行保存的方法
2018/05/16 Python
pandas DataFrame行或列的删除方法的实现示例
2019/08/02 Python
使用keras根据层名称来初始化网络
2020/05/21 Python
利用CSS3实现毛玻璃效果示例源码
2016/09/25 HTML / CSS
Jdbc数据访问技术面试题
2012/03/30 面试题
酒店出纳岗位职责
2013/12/29 职场文书
五年级英语教学反思
2014/01/31 职场文书
护理专业学生职业生涯规划范文
2014/03/11 职场文书
法人委托书范本
2014/04/04 职场文书
党的生日活动方案
2014/08/15 职场文书
学生会干部自我鉴定2014
2014/09/18 职场文书
审计局班子四风对照检查材料思想汇报
2014/10/07 职场文书
党的群众路线教育实践活动查摆问题及整改措施
2014/10/10 职场文书
Mysql数据库表中为什么有索引却没有提高查询速度
2022/02/24 MySQL