滚动方向区分为正负：

<!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. selenium python 启动Firefox

    我的火狐浏览器版本是最新的: 下载geckodrive:https://github.com/mozilla/geckodriver/releases/ 下载完后将exe文件放到这里“D:\firef ...

  2. cloudflare的NS服务器地址

    abby.ns.cloudflare.com,   alex.ns.cloudflare.com,   amy.ns.cloudflare.com,andy.ns.cloudflare.com,  a ...

  3. word转pdf时图片质量下降的解决方案__亲测有效

    写论文时经常需要将word文档转成pdf文档,通常的做法是word另存为pdf文档,这样很简洁很方面,可是最大的问题是图片质量会大大下降.究其原因,“另存为”选项会压缩图片,以降低pdf文档的大小.解 ...

  4. [lr] 矫正白平衡

    中性色区域 • 定义 中性色又称为无彩色系,是指由黑色.白色及由黑白调和成的各种深浅不同的灰色系列.中性色既不属于冷色调,也不属于暖色调.黑白灰是常用到的三大中性色.中性色区域是指不包含色彩的区域,准 ...

  5. css 文本超出容器长度后自动省略的方法!

    我们在给用户显示文本内容的时候,往往需要避免文本内容超出容器宽度,防止换行溢出,小弟在网上找了下发现网上的实现仅仅只是实现了用 ...省略了的功能! 而并没有获取光标提示的功能,所有小弟就结合网上的代 ...

  6. 023-centos6.5上安装使用xtrabackup

    第一步:下载.这个就看你选择什么样的安装方式了,有二进制安装,有源码包安装,有在线的rpm安装.我选择二进制安装方式,所以下载时选择linux-Generic.下载后用rz命令在xshell上上传到l ...

  7. JSP—中文乱码

    中文乱码问题? --------------------------------------- 不乱码的条件: 1.JSP页面本身的编码 pageEncoding UTF-8 (把jsp页面翻译成ja ...

  8. 1mysql的安装

    1.mysql的安装:(1).在'开始'出搜索 'cmd';(2).打开mysql所在磁盘和文件 并安装 d: d:\>cd mysql d:\mysql>cd bin d:\mysql\ ...

  9. hdu4991 树状数组+dp

    这题说的是给了一个序列长度为n 然后求这个序列的严格递增序列长度是m的方案有多少种,如果用dp做那么对于状态有dp[n][m]=dp[10000][100],时间复杂度为n*m*n接受不了那么想想是否 ...

  10. 基于Axis1.4的webservice接口开发（代码开发）

    基于Axis1.4的webservice接口开发(代码开发) 一.开发环境: 我的开发环境是MyEclipse 2015+Apache-Tomcat-8.0.21. 二.代码开发: 1.新建一个Web ...