滚动方向区分为正负：

<!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. [LeetCode] 225. Implement Stack using Queues_Easy tag: Design

    Implement the following operations of a stack using queues. push(x) -- Push element x onto stack. po ...

  2. #C++初学记录（算法3）

    C - 不要62 杭州人称那些傻乎乎粘嗒嗒的人为62(音:laoer). 杭州交通管理局经常会扩充一些的士车牌照,新近出来一个好消息,以后上牌照,不再含有不吉利的数字了,这样一来,就可以消除个别的士司 ...

  3. SSM三层模型之间的参数传递

    Controller接收各种形式的传参:   RequestMapping()包含三部分信息:   表单传参: 1.表单action请求   1:参数名称和顺序都要和表单字段名称一致,直接接收(适合字 ...

  4. 《User Modeling with Neural Network for Review Rating Prediction》评论打分预测

    摘要: 传统的评分预测只考虑到了文本信息,没有考虑到用户的信息,因为同一个词 在不同的用户表达中是不一样的.同样good 一词, 有人觉得5分是good 有人觉得4分是good.但是传统的文本向量表达 ...

  5. Hadoop学习之路（二十四）YARN的资源调度

    YARN 1.1.YARN 概述 YARN(Yet Another Resource Negotiator) YARN 是一个资源调度平台,负责为运算程序提供服务器运算资源,相当于一个分布式的操 作系 ...

  6. Excel脱拽或者下拉公式时， 保持公式里单元格数字不变

    绝对引用 可以选中B1 用F4快捷键自己就给加绝对引用符号了 然后回车 复制或者拖拽

  7. 多线程---ReentrantLock

    package com.test; import java.util.Collection; import java.util.concurrent.locks.Lock; import java.u ...

  8. Linux学习笔记之Linux Centos关闭防火墙

    # Centos6.x /etc/init.d/iptables stop chkconfig iptables off sed -i 's/SELINUX=enforcing/SELINUX=dis ...

  9. j2ee分布式缓存同步实现方案dlcache v1.0.1

    j2ee分布式缓存同步实现方案dlcache v1.0.1 发布 修复问题: 1.支持两个层次的缓存,典型的用于产品大类.产品小类,数据字典以及子项: 更新后见: pan http://pan.bai ...

  10. AJAX 与 Python 后台通信

    Ajax 简介 Ajax 即“Asynchronous Javascript And XML”(异步 JavaScript 和 XML),是指一种创建交互式网页应用的网页开发技术. Ajax = 异步 ...