码迷,mamicode.com
首页 > 其他好文 > 详细

鼠标滚轮插件

时间:2014-12-19 15:28:09      阅读:134      评论:0      收藏:0      [点我收藏+]

标签:

在做视觉差幻灯片时,为了美观需要将滚动条隐藏掉,没有滚动条就无法出发scroll()事件,所以可以使用鼠标滚轮事件来代替。

使用原生的js鼠标滚轮事件会有兼容性问题,为jQuery也没有实现鼠标滚轮事件,有一款不错的jQuery插件可以弥补

文档技术分享https://github.com/jquery/jquery-mousewheel

实例:http://sandbox.runjs.cn/show/ifz4r8bx

核心代码:

$(body).bind(mousewheel,function(event){
                //三个属性
                //deltaX 不知道是干嘛的
                //deltaY 向下滚为-1,反之为+1
                //deltaFactor 应该是滚动的幅度,不同浏览器不相同 
                 console.log(event.deltaX, event.deltaY, event.deltaFactor);
                 var _this = $(this),
                      top = _this.scrollTop() + event.deltaFactor*event.deltaY*-1;
                 _this.scrollTop(top);
});

 

鼠标滚轮插件

标签:

原文地址:http://www.cnblogs.com/yunxianli/p/4172108.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!