JSマウスホイールスクロールイベントバインディングの簡単な例(主流ブラウザと互換性あり)_JavaScriptスキル

WBOY
リリース: 2016-05-16 17:03:57
オリジナル
1415 人が閲覧しました
コードをコピー コードは次のとおりです:

/**Event handler for mouse wheel event.
*Mouse scroll event
*/ 
        var wheel = function(event) { 
            var delta = 0; 
            if (!event) /* For IE. */ 
                event = window.event; 
            if (event.wheelDelta) { /*Mozilla case.*/ 
                delta = event.wheelDelta / 120; 
            } else if (event.detail) { 
                /**In Mozilla, sign of delta is different than in IE.
                 * Also, delta is multiple of 3.
                */ 
                /**If delta is nonzero, handle it.
             * Basically, delta is now positive if wheel was scrolled up,
             * and negative, if wheel was scrolled down.
            */ 
                delta = -event.detail / 3; 
            } 
            /**Prevent default actions caused by mouse wheel.
             * That might be ugly, but we handle scrolls somehow
             * anyway, so don't bother here..
            */ 
            if (delta) 
                handle(delta); 
            /**Initialization code. 
         * If you use your own event management code, change it as required.
        */ 
            if (event.preventDefault) 
                event.preventDefault(); 
            event.returnValue = false; 
        } 

        /**DOMMouseScroll is for mozilla.*/ 
        if (window.addEventListener) { 
            /**IE/Opera.*/ 
            window.addEventListener('DOMMouseScroll', wheel, false); 
        } 
        /**This is high-level function.
         * It must react to delta being more/less than zero.
        */ 
        window.onmousewheel = document.onmousewheel = wheel; 

        /***/ 
        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); マウスホイールを上にスクロール: " デルタ " 回! ") // -1 $ (" btn_last_写真 ")。クリックしてください (ランダム番号);
リターン;
}
}


関連ラベル:
js
ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
最新の問題
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート