scroll时判断向下滚动还是向上滚动

2017-07-28 12:02:53

有时候需要用到，判断页面是向上还是向下滚动了，兼容比较低版本的浏览器如IE6、7等。 

原理：拿当前的scrollTop和之前的scrollTop对比 
如果变大了，表示向下滚动（scrollTop值变大）； 
如果变小了，表示向上滚动（scrollTop值变小）。 

难点是理解setTimeout=0时的运行机制。 

Js代码  收藏代码

  1. $(document).ready(function(){  

  2.     var p=0,t=0;  

  3.   

  4.     $(window).scroll(function(e){  

  5.             p = $(this).scrollTop();  

  6.               

  7.             if(t<=p){//下滚  

  8.                 .......  

  9.             }  

  10.               

  11.             else{//上滚  

  12.                 .......  

  13.             }  

  14.             setTimeout(function(){t = p;},0);         

  15.     });  

  16. });  



  • 精彩推荐

  • 2017-08-17 19:26:00

    mysql安装目录、配置文件存放位置

    linux系统下，如何知道mysql使用的配置文件到底是哪个呢？linux自带的mysql的安装目录又是什么呢？数据存放在什么目录下？

  • 2017-09-05 11:48:16

    Laravel 服务容器实例教程 —— 深入理解控制反转（IoC）和依赖注入（DI）

    容器，字面上理解就是装东西的东西。常见的变量、对象属性等都可以算是容器。一个容器能够装什么，全部取决于你对该容器的定义。当然，有这样一种容器，它存放的不是文本、数值，而是对象、对象的描述（类、接口）或者是提供对象的回调，通过这种容器，我们得以实现许多高级的功能，其中最常提到的，就是 “解耦” 、“依赖注入（DI）”。本文就从这里开始。