zoukankan      html  css  js  c++  java
  • 滚轮事件的应用

    主要知识点:
    1、滚轮事件的应用代码
    2、火狐浏览器与IE浏览器应用滚轮事件的区别。
    火狐浏览器应用滚轮事件只能通过addEventListener(“DOMMouseScroll”,function,false).
    3、e.wheelDelta > 0表示滚轮向上,反之向下。
    e.detail < 0表示滚轮向下,反之向上。

    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>mousewheel</title>
    </head>
    <body>
    <div id="btn" style=" 300px;height: 300px;background-color: yellow"></div>
        <script type="text/javascript">
        var btn = document.getElementById("btn");
        btn.onmousewheel = function(e) {
            var e = e || window.event;
            if(e.wheelDelta > 0) {
                alert("up")
            }else {
                alert("down")
            }
            console.log(e);
        }
        document.addEventListener("DOMMouseScroll",function(e) {
            var e = e || window.event;
            console.log(e);
            if(e.detail < 0) {
                alert("up")
            }else {
                alert("down");
            }
        },false)
        </script>
    </body>
    </html>
  • 相关阅读:
    2017.1.10学习笔记
    v-model双向绑定
    指令之v-bind
    v-for列表渲染
    事件修饰符
    v-on
    指令v-text v-html
    vue起步
    Swoole HTTPServer
    SwooleTCP
  • 原文地址:https://www.cnblogs.com/jiandanshishu/p/12953303.html
Copyright © 2011-2022 走看看