js鼠標(biāo)滑輪滾動(dòng)事件綁定的簡(jiǎn)單實(shí)例(兼容主流瀏覽器)
更新時(shí)間:2014年01月14日 08:50:55 作者:
本篇文章主要介紹了js鼠標(biāo)滑輪滾動(dòng)事件綁定的簡(jiǎn)單實(shí)例(兼容主流瀏覽器)。需要的朋友可以過(guò)來(lái)參考下,希望對(duì)大家有所幫助
復(fù)制代碼 代碼如下:
/** Event handler for mouse wheel event.
*鼠標(biāo)滾動(dòng)事件
*/
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("鼠標(biāo)滑輪向下滾動(dòng):" + delta + "次!"); // 1
$("btn_next_pic").onclick(random_num);
return;
} else {
// alert("鼠標(biāo)滑輪向上滾動(dòng):" + delta + "次!"); // -1
$("btn_last_pic").onclick(random_num);
return;
}
}
相關(guān)文章
javascript在子頁(yè)面中函數(shù)無(wú)法調(diào)試問(wèn)題解決方法
遇到在子頁(yè)面中提交的時(shí)候會(huì)無(wú)法能夠調(diào)試javascript代碼的情況出現(xiàn),下面有個(gè)不錯(cuò)的解決方法,希望對(duì)大家有所幫助2014-01-01
JavaScript基于DOM操作實(shí)現(xiàn)簡(jiǎn)單的數(shù)學(xué)運(yùn)算功能示例
這篇文章主要介紹了JavaScript基于DOM操作實(shí)現(xiàn)簡(jiǎn)單的數(shù)學(xué)運(yùn)算功能,涉及javascript節(jié)點(diǎn)操作、元素遍歷及數(shù)學(xué)運(yùn)算相關(guān)操作技巧,需要的朋友可以參考下2017-01-01
JS實(shí)現(xiàn)在狀態(tài)欄顯示打字效果完整實(shí)例
這篇文章主要介紹了JS實(shí)現(xiàn)在狀態(tài)欄顯示打字效果的方法,涉及JavaScript中字符遍歷結(jié)合時(shí)間函數(shù)對(duì)狀態(tài)欄顯示進(jìn)行操作的相關(guān)技巧,具有一定參考借鑒價(jià)值,需要的朋友可以參考下2015-11-11
小程序開(kāi)發(fā)實(shí)現(xiàn)access_token統(tǒng)一管理
本文主要介紹了小程序開(kāi)發(fā)實(shí)現(xiàn)access_token統(tǒng)一管理,文中通過(guò)示例代碼介紹的非常詳細(xì),需要的朋友們下面隨著小編來(lái)一起學(xué)習(xí)學(xué)習(xí)吧2021-07-07
使用 UniApp 實(shí)現(xiàn)小程序的微信登錄功能
這篇文章主要介紹了使用 UniApp 實(shí)現(xiàn)小程序的微信登錄功能,本文通過(guò)實(shí)例代碼給大家介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或工作具有一定的參考借鑒價(jià)值,需要的朋友可以參考下2020-06-06
JS中2種定時(shí)器的使用及清除的實(shí)現(xiàn)
本文主要介紹了JS中2種定時(shí)器的使用及清除的實(shí)現(xiàn),文中通過(guò)示例代碼介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友們下面隨著小編來(lái)一起學(xué)習(xí)學(xué)習(xí)吧2022-08-08

