滚动方向区分为正负：

<!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. Jquery map()

    <!DOCTYPE html> <html> <head> <style>p { color:red; }</style> <scri ...

  2. 自动生产jason的工具

    EnjoySR/ESJsonFormat-Xcode

  3. [ps] 灰度和通道基础知识

    灰度.灰度值.灰度图像 灰度:灰度使用黑色调来表示物体,即用黑色为基准色,不同饱和度的黑色来显示图像.每个灰度对象都具有从0%(白色)到100%(黑色)的亮度值.使用黑白或灰度扫描仪生成的图像通常以灰 ...

  4. (转)mysql数据文件解析

    一 数据文件 在 MySQL中每一个数据库都会在定义好(或者默认)的数据目录下存在一个以数据库名字命名的文件夹,用来存放该数据库中各种表数据文件.不同的 MySQL存储引擎有各自不同的数据文件,存放位 ...

  5. #C语言初学记录(位运算)

    位运算 Problem Description7-1 数组元素循环右移问题 一个数组A中存有N(>0)个整数,在不允许使用另外数组的前提下,将每个整数循环向右移M(≥0)个位置,即将A中的数据由 ...

  6. ajax response 系统错误时responseText出现一堆代码

    在后期维护webform的一个项目时遇到个比较大的坑,前台ajax请求,失败时弹出后台自定义的错误信息responsetext.结果在本地运行时能正常弹出“验证码错误”,而发布到服务器上respons ...

  7. mysql服务器上的mysql这个实例中表的介绍

    1.user表. 分个分隔符

  8. POST—GET—两种提交方式的区别

        主要区别: 安全性 长度限制 数据结构.   总结起来: get方式:以URL字串本身传递数据参数,在服务器端可以从UERY_STRING'这个变量中直接读取,效率较高,但缺乏安全性,也无法来 ...

  9. SQL 中【NULL】和【无】烦躁的问题

    很烦躁,烦躁的很,总结一下. 先简单的说下: NULL   : 不确定的东西 无       :没有东西 复杂的见下文....... 一 .null值 下面举个最简单的例子,平常工作当中肯定比这个sq ...

  10. Java缓存学习之六：Spring单独使用EhCache

      通过在Application Context中配置EhCacheManagerFactoryBean和EhCacheFactoryBean,我们就可以把对应的EhCache的CacheManage ...