滚动方向区分为正负：

<!DOCTYPE html>

<html>

<head lang="en">

    <meta charset="UTF-8">

    <title></title>

    <script type="text/javascript">

       window.onload = function(){

           //去掉默认的contextmenu事件，否则会和右键事件同时出现。

           document.oncontextmenu = function(e){

               e.preventDefault();

           };

           document.getElementById("test").onmousedown = function(e){

               if(e.button ==2){

                   alert("你点了右键");

               }else if(e.button ==0){

                   alert("你点了左键");

               }else if(e.button ==1){

                   alert("你点了滚轮");

               }

           }

       }

    </script>

</head>

<body>

 <label for="wheelDelta">滚动值:</label>(IE/Opera)<input type="text" id="wheelDelta"/>

<label for="detail">滚动值:(Firefox)</label><input type="text" id="detail"/>

<script type="text/javascript">

var scrollFunc=function(e){

    ee=e || window.event;

    var t1=document.getElementById("wheelDelta");

    var t2=document.getElementById("detail");

    if(e.wheelDelta){//IE/Opera/Chrome

        t1.value=e.wheelDelta;

    }else if(e.detail){//Firefox

        t2.value=e.detail;

    }

}

/*注册事件*/

if(document.addEventListener){

    document.addEventListener('DOMMouseScroll',scrollFunc,false);

}//W3C

window.onmousewheel=document.onmousewheel=scrollFunc;//IE/Opera/Chrome

</script>

<div style="width: 400px;height:400px;margin:auto;border:1px solid pink" id="test"></div>

</body>

</html>

　　

js 捕捉滚轮的滚动的更多相关文章

  1. js鼠标滚轮滚动图片切换效果

    效果体验网址:http://keleyi.com/keleyi/phtml/image/12.htm HTML文件代码: <!DOCTYPE html PUBLIC "-//W3C// ...

  2. JS判断鼠标向上滚动还是向下滚动

    js如何判断滚轮的上下滚动,我们应该都见到过这种效果,用鼠标滚轮实现某个表单内的数字向上滚动就增加,向下滚动就减少的操作,这种效果是通过js对鼠标滚轮的事件监听来实现的.今天简单的研究了一下如何使用j ...

  3. JS鼠标滚轮事件解析

    一.不同浏览器的鼠标滚轮事件 首先,不同的浏览器有不同的滚轮事件.主要是有两种,onmousewheel(IE/Opera/Chrome支持,firefox不支持)和DOMMouseScroll(只有 ...

  4. Sequence.js 实现带有视差滚动特效的图片滑块

    Sequence.js 功能齐全,除了能实现之前分享过的现代的图片滑动效果,还可以融合当前非常流行的视差滚动(Parallax Scrolling)效果.让多层背景以不同的速度移动,形成立体的运动效果 ...

  5. js点击左右滚动+默认自动滚动类

    js点击左右滚动+默认自动滚动类 点击下载

  6. js 实现单行文本滚动效果

    js 代码如下: /***************滚动场次开始*****************/ function ScrollText(content, btnPrevious, btnNext, ...

  7. js 实现文字列表滚动效果

    今天要实现抽奖名单在首页滚动展示的效果,就用js写了一个,代码如下: html代码: <style type="text/css"> *{margin:;padding ...

  8. js捕捉IE窗口失去焦点事件,判断离开页面刷新或关闭的方法

    js捕捉IE窗口失去焦点事件,判断离开页面刷新或关闭的方法 javascript如何捕捉IE窗口失去焦点事件window.onblur = function(e) { //you code}; 弹框的 ...

  9. js标题文字向上滚动

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xht ...

随机推荐

  1. POJ：1182 食物链（带权并查集）

    http://poj.org/problem?id=1182 Description 动物王国中有三类动物A,B,C,这三类动物的食物链构成了有趣的环形.A吃B, B吃C,C吃A. 现有N个动物,以1 ...

  2. PAT 1054 The Dominant Color[简单][运行超时的问题]

    1054 The Dominant Color (20)(20 分) Behind the scenes in the computer's memory, color is always talke ...

  3. JavaScript加强

    1.Aptana简介 Aptana是一个非常强大,开源,专注于JavaScript的Ajax开发IDE它的特性包括 1.JavaScript,JavaScript函数,HTML,CSS语言的Code  ...

  4. python3与mysql：创建表、插入数据54

    import pymysql db = pymysql.connect(host=',db='jodb1',port=3307,charset='utf8') # #测试连接开发库成功 # db = ...

  5. iOS UI基础-4.1应用程序管理 字典转Model

    用模型取代字典 使用字典的坏处 一般情况下,设置数据和取出数据都使用“字符串类型的key”,编写这些key时,编辑器没有智能提示,需要手敲 dict[@"name"] = @&qu ...

  6. 前端开发必备之Chrome开发者工具（上篇）

    本文介绍的 Chrome 开发者工具基于 Chrome 65版本,如果你的 Chrome 开发者工具没有下文提到的那些内容,请检查下 Chrome 的版本 简介 Chrome 开发者工具是一套内置于 ...

  7. sift 与 surf 算法

    http://blog.csdn.net/cy513/article/details/4414352 SURF算法是SIFT算法的加速版,OpenCV的SURF算法在适中的条件下完成两幅图像中物体的匹 ...

  8. 浅谈EM算法的两个理解角度

    http://blog.csdn.net/xmu_jupiter/article/details/50936177 最近在写毕业论文,由于EM算法在我的研究方向中经常用到,所以把相关的资料又拿出来看了 ...

  9. 【转】SQL Server、Oracle、MySQL和Vertica数据库常用函数对比

    SQL Server.Oracle.MySQL和Vertica数据库常用函数对比 Vertica数据库是HP公司新收购的用于BI方面的数据库. 1. 绝对值 S:select abs(-1) valu ...

  10. python 简单的爬虫

    import urllib.request import re import ssl # 处理https请求 import time import os # 创建目录用 def get_html(ur ...