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脚本根据手机浏览器类型跳转WAP手机网站(两种方式)
Aug 04 Javascript
JS模拟并美化的表单控件完整实例
Aug 19 Javascript
js中的面向对象入门
Mar 06 Javascript
jquery实现一个全局计时器(商城可用)
Jun 30 jQuery
Vue中之nextTick函数源码分析详解
Oct 17 Javascript
基于bootstrap写的一点localStorage本地储存
Nov 21 Javascript
vue.js 实现点击展开收起动画效果
Jul 07 Javascript
基于elementUI实现图片预览组件的示例代码
Mar 31 Javascript
封装微信小程序http拦截器过程解析
Aug 13 Javascript
JavaScript算法学习之冒泡排序和选择排序
Nov 02 Javascript
微信小程序getLocation 需要在app.json中声明permission字段
Mar 03 Javascript
关于vue属性使用和不使用冒号的区别说明
Oct 22 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
解析Extjs与php数据交互(增删查改)
2013/06/25 PHP
通过php动态传数据到highcharts
2017/04/05 PHP
js 实现无干扰阴影效果 简单好用(附文件下载)
2009/12/27 Javascript
JS获取页面窗口大小的代码解读
2011/12/01 Javascript
js 实现菜单左右滚动显示示例介绍
2013/11/21 Javascript
JQuery自动触发事件的方法
2015/06/13 Javascript
JavaScript对象属性检查、增加、删除、访问操作实例
2015/07/08 Javascript
Javascript随机标签云代码实例
2016/06/21 Javascript
jQuery使用$获取对象后检查该对象是否存在的实现方法
2016/09/04 Javascript
jquery hover 不停闪动问题的解决方法(亦为stop()的使用)
2017/02/10 Javascript
微信小程序开发之数据存储 参数传递 数据缓存
2017/04/13 Javascript
jQuery使用JSONP实现跨域获取数据的三种方法详解
2017/05/04 jQuery
jsonp跨域请求详解
2017/07/13 Javascript
详解vue如何使用rules对表单字段进行校验
2018/10/17 Javascript
vue移动端html5页面根据屏幕适配的四种解决方法
2018/10/19 Javascript
微信小程序与公众号实现数据互通的方法
2019/07/25 Javascript
react-router-dom 嵌套路由的实现
2020/05/02 Javascript
python实现list元素按关键字相加减的方法示例
2017/06/09 Python
pycharm中import呈现灰色原因的解决方法
2020/03/04 Python
在python tkinter界面中添加按钮的实例
2020/03/04 Python
Django返回HTML文件的实现方法
2020/09/17 Python
python安装第三方库如xlrd的方法
2020/10/31 Python
python向xls写入数据(包括合并,边框,对齐,列宽)
2021/02/02 Python
纯css3实现鼠标经过图片显示描述的动画效果
2014/09/01 HTML / CSS
纽约著名的服装辅料来源:M&J Trimming
2017/07/26 全球购物
PAUL HEWITT手表美国站:德国北部时尚生活配饰品牌,船锚元素
2017/11/18 全球购物
英国最大的户外商店:Go Outdoors
2019/04/17 全球购物
ORLY官网:美国专业美甲一线品牌
2019/12/11 全球购物
办公室文员工作职责
2014/01/31 职场文书
迟到早退检讨书
2014/02/10 职场文书
《小儿垂钓》教学反思
2014/02/23 职场文书
缅怀革命先烈演讲稿
2014/05/14 职场文书
读群众路线的心得体会
2014/09/03 职场文书
公司授权委托书格式范文
2014/10/02 职场文书
2014年机关作风建设工作总结
2014/10/23 职场文书
《最终幻想14》6.01版本4月5日推出 追加新任务新道具
2022/04/03 其他游戏