<!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. 前端 ----js的事件流的概念（重要）

    09-JS的事件流的概念(重点)   在学习jQuery的事件之前,大家必须要对JS的事件有所了解.看下文 事件的概念 HTML中与javascript交互是通过事件驱动来实现的,例如鼠标点击事件.页 ...

  2. 前端 -----jQuery的选择器

    02-jQuery的选择器   我们以前在CSS中学习的选择器有: 今天来学习一下jQuery 选择器. jQuery选择器是jQuery强大的体现,它提供了一组方法,让我们更加方便的获取到页面中的元 ...

  3. 【原创】大叔经验分享（34）hive中文注释乱码

    在hive中查看表结构时中文注释乱码,分为两种情况,一种是desc $table,一种是show create table $table 1 数据库字符集 检查 mysql> show vari ...

  4. 重启报错：Failed to open /dev/initctl: No such device or address

    [root@WEB-APP-REP-MASTER ~]# rebootError getting authority: Error initializing authority: Error call ...

  5. JsonResponse

    1.JsonResponse class JsonResponse(data, encoder=DjangoJSONEncoder, safe=True, json_dumps_params=None ...

  6. LuoGu P2420 让我们异或吧

    其实......这就是个SB题,本来看到这个题,和树上路径有关 于是--我就欣喜地打了一个树剖上去,结果嘞,异或两遍等于没异或 所以这题和LCA屁关系都没有,所以这题就是个树上DFS!!!! 所以它为 ...

  7. js基础学习

  8. JS和Jquery获取和修改label的值的示例代码

    abel标签在JS和Jquery中使用不能像其他标签一样用value获取它的值,下面有个不错的示例,希望大家可以学习下 来源:  <  JS和Jquery获取和修改label的值的示例代码  & ...

  9. Confluence 6 SQL Server 数据库驱动修改

    从 Confluence 6.4 开始,我们使用官方的 Microsoft SQL Server JDBC 驱动来替换掉开源的 jTDS 驱动.从这个版本开始所有的安装都会默认使用官方的 Micros ...

  10. SS-QT5

    https://blog.csdn.net/sos218909/article/details/78781017