<!doctype html>

 <html>

 <head>

 <meta charset="utf-8">

 <title>JavaScript onmousewheel鼠标滚轮示例</title>

 <style>

 #div1 { width:100px; height:100px; background-color:#}

 </style>

 <script>

 window.onload = function(){

     var oDiv = document.getElementById('div1');

     oDiv.onmousewheel = fn;  

     if(oDiv.addEventListener){

         oDiv.addEventListener('DOMMouseScroll',fn,false);

     }

     function fn(ev){

         var ev = ev || event;

         var b = true;

         if(ev.wheelDelta){

             b = ev.wheelDelta >  ? true : false;

             }else{

                 b = ev.detail <  ? true : false;

                 }

         if(b){

             if(this.offsetHeight < ){

                 this.style.height = this.offsetHeight +  + 'px';

                 };

             }else{

                 if(this.offsetHeight > ){

                     this.style.height = this.offsetHeight -  + 'px';

                 }

             }

         if(ev.preventDefault){

             ev.preventDefault();

             }

         return false;

         }

 }

 </script>

 </head>

 <body>

 <div id="div1"></div>

 </body>

 </html>

JavaScript onmousewheel鼠标滚轮示例的更多相关文章

  1. javaScript判断鼠标滚轮的上下滚动

    分享一个js实现判断鼠标滚轮的上下滚动: <script type="text/javascript"> var scrollFunc = function (e) { ...

  2. JavaScript键盘鼠标事件处理

    监听键盘鼠标事件 监听某个按键事件 当键盘上的某个键被按下时,会依次触发一次下面的事件: onkeydown: 键盘按下这个动作(按下键盘) onkeypress: 键盘被按住(一直按着键盘不动) o ...

  3. JavaScript中的鼠标滚轮事件详解

    JavaScript中的鼠标滚轮事件详解/*Firefox注册事件*/ ~~~Firefox: addEventListener('DOMMouseScroll', handler, false)if ...

  4. HTML中鼠标滚轮事件onmousewheel处理

    滚轮事件是不同浏览器会有一点点区别,一个像Firefox使用DOMMouseScroll ,ff也可以使用addEventListener方法绑定DomMouseScroll事件,其他的浏览器滚轮事件 ...

  5. javascript事件之鼠标滚轮(mousewheel)和DOMMouseScroll事件

    javascript事件之鼠标滚轮(mousewheel)和DOMMouseScroll事件 发布时间:2015-02-07   编辑:www.jquerycn.cn 本文学习下,javascript ...

  6. 纯javaScript实现元素平滑滚动，改进前两个版本，支持鼠标滚轮滚动和点击元素滚动，滚动更顺畅

    windowScroll(id, number, distance, direction, obj) 参数介绍: 1.id:所要滚动的元素id; 2.number:滚动次数; 3.distance:每 ...

  7. Javascript和jquery事件--鼠标滚轮事件WheelEvent

    <1>js事件 滚轮事件在js中,不同浏览器还是有不同的,介于我只测试谷歌和火狐浏览器的情况,其他浏览器有待自行探索.有三种写法: target.onmousewheel = wheel; ...

  8. JavaScript判断鼠标滑轮是向下还是向上滚动

    我们常用的就是鼠标,鼠标中键一般都用于滑动网页,但是网页中很多很炫的效果,使用鼠标滑轮操作更好. 当然对于手机就没有这个设备了,所以就不用考虑手机端的实现方法,手机端有触摸滑动事件. 使用JavaSc ...

  9. 鼠标滚轮事件MouseWheel

    其实在大多数浏览器(IE6, IE7, IE8, Opera 10+, Safari 5+,Chrome)中,都提供了 "mousewheel" 事件.但杯具的是 Firefox ...

随机推荐

  1. HDU 5033

    题意: 给你 N 楼房, 然后给你m个人站在这些楼房之间, 问看到天空的仰角是多少度 思路: 对于每一个人, 算出左边的凸包, 和右边的凸包, 找出最大斜率点, 算角度即可 (我在线算比较费时, 离线 ...

  2. python学习第39天

    # 数据操作 # 增 # 删 # 改 # 查 # 单表查询 # 多表查询

  3. 10)django-ORM(创建，字段类型，字段参数)

    一:ORM关系对象映射(Object Relational Mapping,简称ORM) ORM分两种: DB first 先在数据库中创建数据库表等 Code first 先创建类,然后根据类创建数 ...

  4. Docker快速搭建WordPress博客网站

    WordPress WordPress是一个非常著名的PHP编写的博客平台,发展到目前为止已经形成了一个庞大的网站平台系统.在WP上有规模庞大的插件和主题,可以帮助我们快速建立一个博客甚至网站. 在W ...

  5. LoadRunner学习笔记

    什么是性能测试: 简单说,功能测试是软件是否能用,性能测试是看软件好不好用: 性能测试的含义,大体来讲就是通过自动化的手段,模拟生产运行的业务压力或者相应的场景,来测试协同系统是否满足生产需要. 性能 ...

  6. metaclass（元类）

    一.创建类的执行流程 二.元类的认识 什么是元类呢?在Python3中继承type的就是元类 二.元类的示例 方式一: # 方式一 class MyType(type): '''继承type的就是元类 ...

  7. wireless Penetration Testing & Honeypot and Mis-Association attacks

    重新记一遍 ,在捕获握手数据包的时候不容易获取,所以使用ARP请求.使用自己的无线网卡的地址发送请求,会容易使得无线开启端掉线,迫使重新连接. 1.使用命令   aireplay-ng -3 -b a ...

  8. python(6):Scipy之pandas

    pandas下面的数据结构是Series , DataFrame 在字典中, key 与 value对应, 但是key value 不是独立的, 但是在Series 中index 与value 是独立 ...

  9. 线上CPU飚高（死循环，死锁……）？帮你迅速定位代码位置

    top基本使用: top命令参考本篇文章 查看内存和CPU的top命令,别看输出一大堆,理解了其实很简单 top 命令运行图: 第一行:基本信息 第二行:任务信息 第三行:CPU使用情况 第四行:物理 ...

  10. mysql入门练习

    2.详细解释列mysql执行语句的每个参数与参数值的含义 ​ mysql -hlocalhost -P3306 -uroot -proot 连接数据库,端口号为3306, 用户名root, 密码roo ...