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 相关文章推荐
JS实现浏览器菜单命令
Sep 05 Javascript
基于jQuery替换table中的内容并显示进度条的代码
Aug 02 Javascript
javascript实现yield的方法
Nov 06 Javascript
在线引用最新jquery文件的实现方法
Aug 26 Javascript
input输入框内容实时监测(附代码)
Aug 15 Javascript
JS+jQuery实现注册信息的验证功能
Sep 26 jQuery
百度地图去掉marker覆盖物或者去掉maker的label文字方法
Jan 26 Javascript
Vue中this.$router.push参数获取方法
Feb 27 Javascript
如何在 JavaScript 中更好地利用数组
Sep 27 Javascript
Vue 表情包输入组件的实现代码
Jan 21 Javascript
JS计算两个数组的交集、差集、并集、补集(多种实现方式)
May 21 Javascript
JS实现滑动导航效果
Jan 14 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
PHP脚本数据库功能详解(下)
2006/10/09 PHP
PHP控制网页过期时间的代码
2008/09/28 PHP
php strcmp使用说明
2010/04/22 PHP
百度实时推送api接口应用示例
2014/10/21 PHP
php字符串比较函数用法小结(strcmp,strcasecmp,strnatcmp及strnatcasecmp)
2016/07/18 PHP
PHP使用POP3读取邮箱接收邮件的示例代码
2020/07/08 PHP
用js做一个小游戏平台 (一)
2009/12/29 Javascript
jquery实现可拖动DIV自定义保存到数据的实例
2013/11/20 Javascript
jquery中load方法的用法及注意事项说明
2014/02/22 Javascript
jquery点击切换背景色的简单实例
2016/08/25 Javascript
微信小程序 两种滑动方式(横向滑动,竖向滑动)详细及实例代码
2017/01/13 Javascript
JS触摸事件、手势事件详解
2017/05/04 Javascript
Bootstrap 表单验证formValidation 实现表单动态验证功能
2017/05/17 Javascript
Javacript中自定义的map.js  的方法
2017/11/26 Javascript
解决vue keep-alive 数据更新的问题
2018/09/21 Javascript
微信小程序自定义扫码功能界面的实现代码
2020/07/02 Javascript
nuxt 页面路由配置,主页轮播组件开发操作
2020/11/05 Javascript
JS实现超级好看的鼠标小尾巴特效
2020/12/01 Javascript
[01:34]DAC2018主赛事第四日五佳镜头 Gh巨牙海民助Miracle-死里逃生
2018/04/07 DOTA
[00:59]DOTA2英雄背景故事——上古巨神
2020/06/28 DOTA
Python中用memcached来减少数据库查询次数的教程
2015/04/07 Python
python中关于for循环的碎碎念
2017/06/30 Python
Python高级特性切片(Slice)操作详解
2018/09/27 Python
Pytorch 实现focal_loss 多类别和二分类示例
2020/01/14 Python
HTML5仿手机微信聊天界面
2016/03/18 HTML / CSS
Levi’s美国官网:美国著名的牛仔裤品牌
2016/08/19 全球购物
新闻专业个人自我评价
2013/09/21 职场文书
办公室副主任职责范本
2014/03/08 职场文书
廉洁教育学习材料
2014/05/19 职场文书
六一儿童节演讲稿
2014/05/23 职场文书
职业规划实施方案
2014/06/10 职场文书
地理科学专业自荐信
2014/09/01 职场文书
丧事答谢词
2015/01/05 职场文书
2015年七一建党节活动方案
2015/05/05 职场文书
JavaScript实现简单拖拽效果
2021/09/15 Javascript
【海涛解说】暗牧也疯狂,牛蛙成配角
2022/04/01 DOTA