zoukankan      html  css  js  c++  java
  • 鼠标滚动事件

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

    <html xmlns="http://www.w3.org/1999/xhtml">

    <head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312" />

    <title>无标题文档</title>

    </head>

    <body>

    </body>

    </html>

    <script type="text/javascript">

    var wheel = function(event) { 
                var delta = 0; 
                if (!event) /* For IE. */ 
                    event = window.event; 
                if (event.wheelDelta) { /* IE/Opera. */ 
                    delta = event.wheelDelta / 120; 
               } else if (event.detail) { 

              delta = -event.detail / 3; 
                } 
       
                if (delta) 
                    handle(delta); 
            
               if (event.preventDefault) 
                   event.preventDefault(); 
               event.returnValue = false; 
          } 

        if (window.addEventListener) { 
                /** DOMMouseScroll is for mozilla. */ 
                window.addEventListener('DOMMouseScroll', wheel, false); 
            } 
            /** IE/Opera. */ 
            window.onmousewheel = document.onmousewheel = wheel;  
           var handle = function(delta) { 
                var random_num = Math.floor((Math.random() * 100) + 50); 
                if (delta < 0) { 
                    alert("鼠标滑轮向下滚动:" + delta + "次!"); // 1 
                   // $("btn_next_pic").onclick(random_num); 
                   return; 
                } else { 
                    alert("鼠标滑轮向上滚动:" + delta + "次!"); // -1 
                   // $("btn_last_pic").onclick(random_num); 
                   return; 
                } 
            } 

    </script>

  • 相关阅读:
    原生代码实现Promise
    HTTP与HTTPS的区别
    windows常用命令-长期更新
    git 常用命令
    原型和原型链
    vue 中一些API 或属性的常见用法
    移动端屏幕适配
    Nuxt.js(开启SSR渲染)
    vue+element-ui 实现分页(根据el-table内容变换的分页)
    vue中引入jQuery和bootstrap
  • 原文地址:https://www.cnblogs.com/dearxinli/p/3167061.html
Copyright © 2011-2022 走看看