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. });  



  • 2020-04-28 10:48:39

    使用currentColor设置SVG样式

    css自己也又很多变量哦,大家还要多多学习哦。CSS中的变量很有用,因为它们允许我们写更多DRY(不再自我重复,也就是不需要一直写重复内容的代码)代码。它们对于管理和维护大型项目也有非常好用,因为它们包含了大量重复的值。

  • 2020-04-29 20:57:07

    mac卸载avast

    第一种就是卸载。打开主界面,在左上角Avast一栏中选择卸载。卸载完之后要么再装回去,要么去找找别的杀软吧

  • 2020-05-06 14:43:53

    bootstrap @media尺寸

    超大屏,1100分辨率,880分辨率,720分辨率,440分辨率以下

  • 2020-05-06 22:23:15

    使用querySelector添加移除style和class

    document.querySelector(selector).style.styleName = 样式 使用这个方法可以对dom节点添加和移除style样式,其中的styleName可以为css样式的任何值,如:display、color

  • 2020-05-07 13:05:28

    JavaScript中批量设置Css样式

    setAttribute() 方法添加指定的属性,并为其赋指定的值。 如果这个指定的属性已存在,则仅设置/更改值