Jquery增加鼠标中间功能mousewheel的实例代码
(function ($) {
var types = ['DOMMouseScroll', 'mousewheel'];
$.event.special.mousewheel = {
setup: function () {
if (this.addEventListener) {
for (var i = types.length; i;) {
this.addEventListener(types[--i], handler, false);
}
} else {
this.onmousewheel = handler;
}
},
teardown: function () {
if (this.removeEventListener) {
for (var i = types.length; i;) {
this.removeEventListener(types[--i], handler, false);
}
} else {
this.onmousewheel = null;
}
}
};
$.fn.extend({
mousewheel: function (fn) {
return fn ? this.bind("mousewheel", fn) : this.trigger("mousewheel");
},
unmousewheel: function (fn) {
return this.unbind("mousewheel", fn);
}
});
function handler(event) {
var orgEvent = event || window.event, args = [].slice.call(arguments, 1), delta = 0, returnValue = true, deltaX = 0, deltaY = 0;
event = $.event.fix(orgEvent);
event.type = "mousewheel";
// Old school scrollwheel delta
if (event.originalEvent.wheelDelta) { delta = event.originalEvent.wheelDelta / 120; }
if (event.originalEvent.detail) { delta = -event.originalEvent.detail / 3; }
// New school multidimensional scroll (touchpads) deltas
deltaY = delta;
// Gecko
if (orgEvent.axis !== undefined && orgEvent.axis === orgEvent.HORIZONTAL_AXIS) {
deltaY = 0;
deltaX = -1 * delta;
}
// Webkit
if (orgEvent.wheelDeltaY !== undefined) { deltaY = orgEvent.wheelDeltaY / 120; }
if (orgEvent.wheelDeltaX !== undefined) { deltaX = -1 * orgEvent.wheelDeltaX / 120; }
// Add event and delta to the front of the arguments
args.unshift(event, delta, deltaX, deltaY);
return $.event.handle.apply(this, args);
}
})(jQuery);
调用:
$(document).mousewheel(function (e, detail) {
}
相关文章
jQuery Select(单选) 模拟插件 V1.3.62 改进版
改进jQuery Select(单选) 模拟插件 V1.3.6,增加mouseover事件2010-07-07jQuery插件echarts实现的多柱子柱状图效果示例【附demo源码下载】
这篇文章主要介绍了jQuery插件echarts实现的多柱子柱状图效果,结合完整实例形式分析了echarts绘制多柱子柱状图效果的操作步骤与相关实现技巧,并附带demo源码供读者下载参考,需要的朋友可以参考下2017-03-03jQuery Ajax 实例代码 ($.ajax、$.post、$.get)
下面小编就为大家带来一篇jQuery Ajax 实例代码 ($.ajax、$.post、$.get)。小编觉得挺不错的,现在分享给大家,也给大家做个参考2016-04-04
最新评论