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 相关文章推荐
function foo的原型与prototype属性解惑
Nov 19 Javascript
js实现数字每三位加逗号的方法
Feb 05 Javascript
jQuery的几个我们必须了解的特点
May 03 Javascript
第一次接触JS require.js模块化工具
Apr 17 Javascript
jquery.form.js框架实现文件上传功能案例解析(springmvc)
May 26 Javascript
JS实现的自定义水平滚动字体插件完整实例
Jun 17 Javascript
利用Angularjs和原生JS分别实现动态效果的输入框
Sep 01 Javascript
基于JavaScript实现自定义滚动条
Jan 25 Javascript
jQuery实现多张图片上传预览(不经过后端处理)
Apr 29 jQuery
解决vue attr取不到属性值的问题
Sep 18 Javascript
使用Taro实现小程序商城的购物车功能模块的实例代码
Jun 05 Javascript
前端监听websocket消息并实时弹出(实例代码)
Nov 27 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简单操作mysql数据库的类
2015/04/16 PHP
纯php生成随机密码
2015/10/30 PHP
php制作简单模版引擎
2016/04/07 PHP
浅谈ThinkPHP5.0版本和ThinkPHP3.2版本的区别
2017/06/17 PHP
Extjs学习过程中新手容易碰到的低级错误积累
2010/02/11 Javascript
用javascript对一个json数组深度赋值示例
2014/07/27 Javascript
分享20款美化网站的 jQuery Lightbox 灯箱插件
2014/10/10 Javascript
使用js画图之饼图
2015/01/12 Javascript
js实现图片从左往右渐变切换效果的方法
2015/02/06 Javascript
jquery实现页面关键词高亮显示的方法
2015/03/12 Javascript
Angularjs制作简单的路由功能demo
2015/04/14 Javascript
JS实现仿新浪黄色经典滑动门效果代码
2015/09/27 Javascript
JS实现黑色风格的网页TAB选项卡效果代码
2015/10/09 Javascript
Jquery操作Ajax方法小结
2015/11/29 Javascript
JavaScript实现星星等级评价功能
2017/03/22 Javascript
jQuery实现的事件绑定功能基本示例
2017/10/11 jQuery
Vue.js实现列表清单的操作方法
2017/11/15 Javascript
angular-tree-component的使用详解
2018/07/30 Javascript
vue click.stop阻止点击事件继续传播的方法
2018/09/04 Javascript
JavaScript变速动画函数封装添加任意多个属性
2019/04/03 Javascript
layer父页获取弹出层输入框里面的值方法
2019/09/02 Javascript
JavaScript判断数据类型有几种方法及区别介绍
2020/09/02 Javascript
python学习 流程控制语句详解
2016/06/01 Python
Python编程深度学习绘图库之matplotlib
2018/12/28 Python
python 二维矩阵转三维矩阵示例
2019/11/30 Python
在django admin详情表单显示中添加自定义控件的实现
2020/03/11 Python
法国时尚童装网站:Melijoe
2016/08/10 全球购物
KIKO美国官网:意大利的平价彩妆品牌
2017/05/16 全球购物
天网面试题
2013/04/07 面试题
会计出纳岗位职责
2013/12/25 职场文书
大学军训感言
2014/01/10 职场文书
小摄影师教学反思
2014/04/27 职场文书
农村党支部书记四风问题个人对照检查材料
2014/09/21 职场文书
群众路线教育党员自我剖析材料
2014/10/06 职场文书
Python中22个万用公式的小结
2021/07/21 Python
微软Win11有哪些隐藏功能? windows11多个功能汇总
2021/11/21 数码科技