JS简单判断滚动条的滚动方向实现方法


Posted in Javascript onApril 28, 2017

本文实例讲述了JS简单判断滚动条的滚动方向实现方法。分享给大家供大家参考,具体如下:

以下代码实现判断页面的滚动条的滚动方向;

var sign = 80;//定义默认的向上滚与向下滚的边界
window.onscroll = window.onresize = function(){
    var oScrollTop=$(window).scrollTop();
    if ( oScrollTop > 80) {



//write your code
    }
    if ( oScrollTop < 80) {



//write your code


}
    if ( oScrollTop > sign) {
      sign = oScrollTop;//更新scrollTop
      //console.log('向下');
    }
    if ( oScrollTop< sign) {
      sign = oScrollTop//更新scrollTop
      //console.log('向上');
    }
}

希望本文所述对大家JavaScript程序设计有所帮助。

Javascript 相关文章推荐
测试JavaScript字符串处理性能的代码
Dec 07 Javascript
jQuery实现移动端滑块拖动选择数字效果
Dec 24 Javascript
封装获取dom元素的简单实例
Jul 08 Javascript
Angular2下使用pdf插件的方法详解
Apr 29 Javascript
jQuery实现简单的抽奖游戏
May 05 jQuery
Node.js Buffer模块功能及常用方法实例分析
Jan 05 Javascript
深入浅析vue-cli@3.0 使用及配置说明
May 08 Javascript
vue-cli 3 全局过滤器的实例代码详解
Jun 03 Javascript
JavaScript的Proxy可以做哪些有意思的事儿
Jun 15 Javascript
webpack+express实现文件精确缓存的示例代码
Jun 11 Javascript
Vue-cli4 配置 element-ui 按需引入操作
Sep 11 Javascript
JavaScript实现单点登录的示例
Sep 23 Javascript
JS组件系列之MVVM组件 vue 30分钟搞定前端增删改查
Apr 28 #Javascript
JS实现禁止用户使用Ctrl+鼠标滚轮缩放网页的方法
Apr 28 #Javascript
jquery实现图片上传前本地预览
Apr 28 #jQuery
JS组件系列之MVVM组件构建自己的Vue组件
Apr 28 #Javascript
JS实现汉字与Unicode码相互转换的方法详解
Apr 28 #Javascript
JS组件系列之JS组件封装过程详解
Apr 28 #Javascript
JS实现的Unicode编码转换操作示例
Apr 28 #Javascript
You might like
php.ini中文版
2006/10/09 PHP
php在linux下检测mysql同步状态的方法
2015/01/15 PHP
php中将一个对象保存到Session中的方法
2015/03/13 PHP
一个简单的php MVC留言本实例代码(必看篇)
2016/09/22 PHP
PHP 进度条函数的简单实例
2017/09/19 PHP
php实现算术验证码功能
2018/12/05 PHP
JavaScript跨浏览器获取页面中相同class节点的方法
2015/03/03 Javascript
JavaScript function函数种类详解
2016/02/22 Javascript
详解Node.js中的事件机制
2016/09/22 Javascript
Javascript的动态增加类的实现方法
2016/10/20 Javascript
Bootstrap复选框和单选按钮美化插件(推荐)
2016/11/23 Javascript
微信小程序自定义组件
2017/08/16 Javascript
解决js相同的正则多次调用test()返回的值却不同的问题
2018/10/10 Javascript
浅谈JavaScript 代码简洁之道
2019/01/09 Javascript
详解搭建一个vue-cli的移动端H5开发模板
2020/01/17 Javascript
js实现数据导出为EXCEL(支持大量数据导出)
2020/03/31 Javascript
[01:24]DOTA2上海特锦赛OG战队抵达 专车接机入驻总统套房
2016/02/23 DOTA
Python发送Email方法实例
2014/08/21 Python
python中使用序列的方法
2015/08/03 Python
Python编程中装饰器的使用示例解析
2016/06/20 Python
Python序列操作之进阶篇
2016/12/08 Python
python实现自动发送报警监控邮件
2018/06/21 Python
如何使用pyinstaller打包32位的exe程序
2019/05/26 Python
python操作ini类型配置文件的实例教程
2020/10/30 Python
python实现三种随机请求头方式
2021/01/05 Python
CSS3实现歌词进度文字颜色填充变化动态效果的思路详解
2020/06/02 HTML / CSS
网页中的电话号码如何实现一键直呼效果_附示例
2016/03/15 HTML / CSS
澳洲网红粉泥面膜:Sand & Sky
2019/08/13 全球购物
美国最大的购物网站:Amazon.com(亚马逊美国)
2020/05/23 全球购物
kfc实习自我鉴定
2013/12/14 职场文书
2014年控辍保学工作总结
2014/12/08 职场文书
优秀团员自我评价
2015/03/10 职场文书
世界上超棒的8种逻辑思维
2019/08/06 职场文书
详解Html5项目适配系统深色模式方案总结
2021/04/14 HTML / CSS
关于Python使用turtle库画任意图的问题
2022/04/01 Python
vue里使用create, mounted调用方法
2022/04/26 Vue.js