鼠标滚轮插件jQuery mousewheel

delta的值是负的即-1,那么滚轮就是向下滚动,正的1就是向上。

插件方法:

1.为了监听滚轮事件,该插件引入了mousewheel事件,所以我们可以监听元素的mousewheel事件

2.该插件还提供了元素快捷方法mousewheel和unmousewheel用于监听和去掉元素对鼠标滚轮事件支持

$(document)
                    .mousewheel(function(event, delta) {
                        loghandle(event, delta);
                    });   //页面中滚动
$('#test6')
                    .mousewheel(function(event, delta) {
                        loghandle(event, delta);
                        event.stopPropagation();
                        event.preventDefault();
                    }); //元素中滚动,且页面不滚动

插件地址:https://github.com/brandonaaron/jquery-mousewheel

鼠标滚轮插件jQuery mousewheel

时间: 2024-10-09 16:44:39

鼠标滚轮插件jQuery mousewheel的相关文章

jQuery 鼠标滚轮插件 jquery.mousewheel.js

jQuery Mousewheel Plugin,用于添加跨浏览器的鼠标滚轮支持.mousewheel事件的处理函数有一点小小的变化,它除了第一个参数event 外,还接收到第二个参数delta.通过参数delta可以获取鼠标滚轮的方向和速度.如果delta的值是负的即-1,那么滚轮就是向下滚动,正的1就是向上. 官方网址: https://github.com/brandonaaron/jquery-mousewheel 插件方法: 1.为了监听滚轮事件,该插件引入了mousewheel事件,

鼠标滚轮插件

在做视觉差幻灯片时,为了美观需要将滚动条隐藏掉,没有滚动条就无法出发scroll()事件,所以可以使用鼠标滚轮事件来代替. 使用原生的js鼠标滚轮事件会有兼容性问题,为jQuery也没有实现鼠标滚轮事件,有一款不错的jQuery插件可以弥补 文档: https://github.com/jquery/jquery-mousewheel 实例:http://sandbox.runjs.cn/show/ifz4r8bx 核心代码: $('body').bind('mousewheel',functi

JS 鼠标滚轮事件(mousewheel/DOMMouseScroll)

onmousewheel (FireFox不支持此事件) 1 // IE/Opera/Chrome/Safari 2 document.body.onmousewheel = function(event) { 3 event = event || window.event; 4 console.dir(event); 5 }; DOMMouseScroll(FireFox独有事件) 1 // Firefox 2 document.body.addEventListener("DOMMouseS

jquery 鼠标滚轮事件 插件 Mousewheel

jquery插件默认是不支持鼠标中轮滚轮事件的,现在我们可以用于添加跨浏览器的鼠标滚轮支持可以使用jquery的Mousewheel插件. 使用mousewheel事件有以下两种方式: 使用mousewheel和unmousewheel事件函数: 使用经典的bind和unbind函数. JavaScript Code复制内容到剪贴板 $('div.mousewheel_example').mousewheel(fn); $('div.mousewheel_example').bind('mous

鼠标滚轮事件MouseWheel

其实在大多数浏览器(IE6, IE7, IE8, Opera 10+, Safari 5+,Chrome)中,都提供了 "mousewheel" 事件.但杯具的是 Firefox 却不支持此事件,不过庆幸 Firefox  中提供了另外一个等同的事件:"DOMMouseScroll" . OK,我们现在已经知道了不同浏览器之间实现的差别,兼容代码如下: var addEvent = (function () { if (window.addEventListener

jQuery 3D圆盘旋转焦点图 支持鼠标滚轮

之前我们分享过很多炫酷实用的jQuery焦点图插件了,今天介绍的这款jQuery焦点图非常特别,所有图片围成一个圆圈,组成一个立体视觉的圆盘,并且可以旋转选择圆盘中的图片.另外,这款jQuery 3D圆盘旋转焦点图插件还支持鼠标滚轮,可以让你更方便地浏览图片. 在线演示源码下载 接下来分析一下实现这款jQuery 3D焦点图的具体过程和源代码,代码主要由HTML.CSS以及jQuery组成,由于JS的参与,相对比较复杂. HTML代码: <ul id="carousel">

基于jQuery鼠标滚轮滑动到页面节点部分

基于jQuery鼠标滚轮滑动到页面节点部分.这是一款基于jQuery+CSS3实现的使用鼠标滚轮或者手势滑动到页面节点部分特效.效果图如下: 在线预览   源码下载 实现的代码. html代码: <section class="panel home" data-section-name="home"> <div class="inner"> <header> <h1></h1> <

鼠标滚轮(mousewheel)和DOMMouseScroll事件

IE6.0首先实现了mousewheel事件.此后,Opera.Chrome和Safari也都实现了这个事件.当用户通过鼠标滚轮与页面交互.在垂直方向上滚动页面时(无论向下还是向上),就会触发mousewheel事件.这个事件可以在任何元素上面触发,最终会冒泡到document(IE)或window(Opera.Chrome.及Safari)对象.与mousewheel事件对应的event对象包含鼠标事件的所有标准信息之外,还包含一个特殊的wheelDelta属性.当用于向前滚动鼠标滚轮是,wh

Winform 中panel的mousewheel鼠标滚轮事件触发

如果将窗体或容器控件(如Panel控件)的AutoScroll属性设置为True时,那么当窗体或Panel容不下其中的子控件时就会出现 滚动条,通过移动滚动条可以上下显示出窗体或Panel中的全部内容.但是默认情况下滚动条的移动只能通过鼠标直接拖动滚动条来实现,而不能通过鼠标的滚 轮来实现上下移动,因此需要手动添加代码来实现这个功能. 滚动鼠标的滚轮,触发的是窗体或控件上的 MouseWheel 事件.但是在VS.net2005中,窗体和控件的事件列表中却不包含 MouseWheel 事件,因此