js鼠标滑轮滚动事件绑定(兼容主流浏览器)
/** Event handler for mouse wheel event.
*鼠标滚动事件
*/
var wheel = function(event) {
var delta = 0;
if (!event) /* For IE. */
event = window.event;
if (event.wheelDelta) { /* IE/Opera. */
delta = event.wheelDelta / 120;
} else if (event.detail) {
/** Mozilla case. */
/** In Mozilla, sign of delta is different than in IE.
* Also, delta is multiple of 3.
*/
delta = -event.detail / 3;
}
/** If delta is nonzero, handle it.
* Basically, delta is now positive if wheel was scrolled up,
* and negative, if wheel was scrolled down.
*/
if (delta)
handle(delta);
/** Prevent default actions caused by mouse wheel.
* That might be ugly, but we handle scrolls somehow
* anyway, so don't bother here..
*/
if (event.preventDefault)
event.preventDefault();
event.returnValue = false;
} /** Initialization code.
* If you use your own event management code, change it as required.
*/
if (window.addEventListener) {
/** DOMMouseScroll is for mozilla. */
window.addEventListener('DOMMouseScroll', wheel, false);
}
/** IE/Opera. */
window.onmousewheel = document.onmousewheel = wheel; /** This is high-level function.
* It must react to delta being more/less than zero.
*/
var handle = function(delta) {
var random_num = Math.floor((Math.random() * 100) + 50);
if (delta < 0) {
// alert("鼠标滑轮向下滚动:" + delta + "次!"); // 1
$("btn_next_pic").onclick(random_num);
return;
} else {
// alert("鼠标滑轮向上滚动:" + delta + "次!"); // -1
$("btn_last_pic").onclick(random_num);
return;
}
}
js鼠标滑轮滚动事件绑定(兼容主流浏览器)的更多相关文章
- 问题记录:JavaFx 鼠标滑轮滚动事件监听!
问题描述: 在listview的item里面添加鼠标拖拽排序功能.代码如下: setOnMouseDragged(event -> { //设定鼠标长按0.3秒后才可拖拽 防止误操作 isCan ...
- 基于原生js的返回顶部组件,兼容主流浏览器
基于原生js的返回顶部插件,兼容IE8及以上.FF.chrome等主流浏览器. js文件中封装了getScrollTop()和changeScrollTop()函数分别用于获取滚动条滚动的高度和修改滚 ...
- js判断鼠标滑轮滚动方向并根据滚动的方向触发不同的事件
<script> var scrollFunc = function (e) { var direct = 0; e = e || window.event; if (e.wheelDel ...
- js鼠标滚轮滚动图片切换效果
效果体验网址:http://keleyi.com/keleyi/phtml/image/12.htm HTML文件代码: <!DOCTYPE html PUBLIC "-//W3C// ...
- js网页滚动条滚动事件实例分析
本文实例讲述了js网页滚动条滚动事件用法.分享给大家供大家参考.具体分析如下: 在做js返回顶部的效果时,要监听网页滚动条滚动事件,这个事件就是:window.onscroll.当onscroll事件 ...
- js鼠标划过事件
js鼠标划过事件一般有两对 onmouseover/onmouseout onmouseenter/onmouseleave 区别: 1.onmouseover/onmouseout 鼠标经过自身会触 ...
- js 鼠标和键盘事件
js 鼠标和键盘事件 鼠标事件 聚焦事件 离焦事件 鼠标单击和双击 鼠标的其他事件 鼠标事件对象 键盘事件 鼠标事件 聚焦事件 <input type="text" id=& ...
- 兼容主流浏览器的CSS透明代码
透明往往能产生不错的网页视觉效果下面是兼容主流浏览器的CSS透明代码.transparent_class { filter:alpha(opacity=50); -moz-opacity:0.5; ...
- (转)兼容主流浏览器的CSS透明代码
透明往往能产生不错的网页视觉效果下面是兼容主流浏览器的CSS透明代码.transparent_class { filter:alpha(opacity=50); -moz-opacity:0.5; - ...
随机推荐
- [Linux] 学习笔记之安装学习环境(sshd, lrzsz)
紧接前一篇,在VMWare安装完Linux,这个时候我们要使用远程工具连接到虚拟机上去了,以前一直使用Putty,后来到新公司之后,推荐使用SecureCRT,使用之后,觉得效果不错,但是每次连接都失 ...
- Codeforces Round #369 (Div. 2) C. Coloring Trees DP
C. Coloring Trees ZS the Coder and Chris the Baboon has arrived at Udayland! They walked in the pa ...
- Liferay 6.2 改造系列之七:关闭使用条款确认、密码提醒、新用户强制修改密码等功能
关闭使用条款确认: 在/portal-master/portal-impl/src/portal.properties配置文件中,有如下配置: # # Set this to true if all ...
- SQL错误码
///////////////////////////////////////////////////////////////ORA-00001: 违反唯一约束条件 (.)ORA-00017: 请求会 ...
- 代码审查工具StyleCop
“代码审查”或是“代码评审”(Code Review),这是一个流程,当开发人员写好代码后,需要让别人来review一下他的代码,这是一种有效发现BUG的方法.由此,我们可以审查代码的风格.逻辑.思路 ...
- uva748 - Exponentiation
import java.io.*; import java.text.*; import java.util.*; import java.math.*; public class Exponenti ...
- ural 1342. Enterprise
1342. Enterprise Time limit: 5.0 secondMemory limit: 64 MB To bind a broom it’s a hard work. As ther ...
- 【原】iOS学习之第三方-AFNetworking1.3.0
将 CocoaPods 安装后,按照 CocoaPods 的使用说明就可以将 AFNetworking 第三方集成到工程中,具体请看上篇博客iOS学习46之第三方CocoaPods的安装和使用(通用方 ...
- ssh An internal error occured during "Add Deployment"
这个问题一般是由于导入别人做的项目,但是项目所用的jdk跟当前所用的jdk不一样. 以前遇到过这个问题没有解决,今天解决了. 右键项目名→Properties→Java Build Path→Libr ...
- BZOJ2706 : [SDOI2012]棋盘覆盖
A类数据: 将棋盘黑白染色,相邻的点之间连边,求出二分图最大匹配即可. B类数据: 答案为$\lfloor\frac{n^2-1}{3}\rfloor$,用FFT加速计算即可,时间复杂度$O(L\lo ...