zoukankan      html  css  js  c++  java
  • js监听页面的scroll事件,当移到底部时触发事件

    //页面拉到底时自动加载更多
    $(window).scroll(function(event){
    var wScrollY = window.scrollY; // 当前滚动条位置
    var wInnerH = window.innerHeight; // 设备窗口的高度(不会变)
    var bScrollH = document.body.scrollHeight; // 滚动条总高度
    if (wScrollY + wInnerH >= bScrollH) {
    showMore();
    }
    });

    //监听上下滚动

    var p=0,t=0;  
      
        $(window).scroll(function(e){  
                p = $(this).scrollTop();  
                  
                if(t<=p){//下滚
                   alert(1);  
                }  
                  
                else{//上滚
                     alert(2); 
                }  
                setTimeout(function(){t = p;},0);         
        });  

    //监听上下滑动方向

    $("body").on("touchstart", function(e) {
        e.preventDefault();
        startX = e.originalEvent.changedTouches[0].pageX,
        startY = e.originalEvent.changedTouches[0].pageY;
      });
      $("body").on("touchmove", function(e) {
        e.preventDefault();
        moveEndX = e.originalEvent.changedTouches[0].pageX,
        moveEndY = e.originalEvent.changedTouches[0].pageY,
        X = moveEndX - startX,
        Y = moveEndY - startY;
    
        if ( Math.abs(X) > Math.abs(Y) && X > 0 ) {
          alert("left 2 right");
        }
        else if ( Math.abs(X) > Math.abs(Y) && X < 0 ) {
          alert("right 2 left");
        }
        else if ( Math.abs(Y) > Math.abs(X) && Y > 0) {
          alert("top 2 bottom");
        }
        else if ( Math.abs(Y) > Math.abs(X) && Y < 0 ) {
          alert("bottom 2 top");
        }
        else{
          alert("just touch");
        }
      });
    

      

  • 相关阅读:
    Java的格式化输出
    常用排序算法的Python实现
    零基础自学用Python 3开发网络爬虫(一)
    Python常见数据结构整理
    百度天气预报API的使用(java版本)
    大总结
    CCS学习(三)
    CSS学习(页外引用还不懂)
    CSS自定义动画
    ssm日期格式转换
  • 原文地址:https://www.cnblogs.com/ecmasea/p/9252979.html
Copyright © 2011-2022 走看看