滚轮事件的应用

最新推荐文章于 2021-09-22 08:47:06 发布

躺屋顶看月亮

最新推荐文章于 2021-09-22 08:47:06 发布

阅读量421

点赞数

分类专栏： js事件文章标签： js拖曳右键菜单 js滚轮事件

本文链接：https://blog.csdn.net/liuxuan12417/article/details/53372980

版权

js事件专栏收录该内容

5 篇文章 0 订阅

订阅专栏

主要知识点：
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="width: 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>

躺屋顶看月亮

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
滚轮事件的应用

主要知识点： 1、滚轮事件的应用代码 2、火狐浏览器与IE浏览器应用滚轮事件的区别。火狐浏览器应用滚轮事件只能通过addEventListener(“DOMMouseScroll”,function,false). 3、e.wheelDelta > 0表示滚轮向上，反之向下。 e.detail < 0表示滚轮向下，反之向上。<!DOCTYPE html><html lang="en">
复制链接

扫一扫