zoukankan      html  css  js  c++  java
  • 鼠标滑轮滚动实现换页

    windowAddMouseWheel();  
    function windowAddMouseWheel() {  
        var i = 0;
        var j = 0;
        var scrollFunc = function (e) {  
            e = e || window.event;  
            j = j+e.wheelDelta;
            /*对位置进行缩小,在超出页面范围时,手动设置一个范围,避免长时间滑动没有效果*/
            if(j > 0){
                j = 5;
            }else if(j < -6554){
                j = -6500;
            }
                panduan(e,j);//调用判断方法,进行页面的定位
        };  
        
        //给页面绑定滑轮滚动事件  
        if (document.addEventListener) {  
            document.addEventListener('DOMMouseScroll', scrollFunc, false);  
        }  
    //滚动滑轮触发scrollFunc方法  
        window.onmousewheel = document.onmousewheel = scrollFunc;  
    } 
    function panduan(e,j){
        if (e.wheelDelta) {  //判断浏览器IE,谷歌滑轮事件     
            if (e.wheelDelta > 0) { //当滑轮向上滚动时  
    //            alert("滑轮向上滚动i"+j);  
            }  
            // if (e.wheelDelta < 0) { //当滑轮向下滚动时  
    //                alert("滑轮向下滚动"+(-e.wheelDelta));     
    //            }  
            if(j <= 0){
                if (j <= 0 && j > -922) { //当滑轮向下滚动时  
                    $("#show").html($("#one_one").html());//第一个页面
                }else if(j < -922 && j >= -1844){
                    $("#show").html($("#two_two").html());//进行页面内容的替换,第二个页面
                }else if(j < -1844 && j >= -2766){
                    $("#show").html($("#three_three").html());//第三个页面
                }else if(j < -2766 && j >= -3688){
                    $("#show").html($("#four_four").html());//第四个页面
                }else if(j < -3688 && j >= -4610){
                    $("#show").html($("#five_five_five").html());//第五个页面
                }else if(j < -4610 && j >= -5532){
                    $("#show").html($("#six_six").html());//第六个页面
                }else if(j < -5532 && j >= -6454){
                    $("#show").html($("#seven_seven").html());//第七个页面
                }else{
                    $("#show").html($("#eight_eight").html());//第八个页面
                }
            }
            
        } else if (e.detail) {  //Firefox滑轮事件  
            if (e.detail> 0) { //当滑轮向上滚动时  
                    i++;
                    window.scrollTo(0,300*i);
                    //alert("滑轮向上滚动"+i);  
            }  
            if (e.detail< 0) { //当滑轮向下滚动时  
                i--;
                window.scrollTo(0,922*i);
                    //alert("滑轮向下滚动"+i);  
            }  
       }  
    }        
  • 相关阅读:
    三目运算符和逗号表达式
    ++与--操作符
    位运算符
    逻辑运算符
    接续符
    单引号和双引号
    注释分析
    enum,sizeof,typedef
    TERADATA数据库操作
    利用Spring的AbstractRoutingDataSource解决多数据源的问题
  • 原文地址:https://www.cnblogs.com/loveMis/p/8558268.html
Copyright © 2011-2022 走看看