`

js 禁止鼠标滑轮滚动的事件

阅读更多

如题,代码如下:

 

// left: 37, up: 38, right: 39, down: 40,
    // spacebar: 32, pageup: 33, pagedown: 34, end: 35, home: 36
    var keys = [37, 38, 39, 40];

    function preventDefault(e) {
        e = e || window.event;
        if (e.preventDefault)
            e.preventDefault();
        e.returnValue = false;
    }

    function keydown(e) {
        for (var i = keys.length; i--;) {
            if (e.keyCode === keys[i]) {
                preventDefault(e);
                return;
            }
        }
    }

    function wheel(e) {
        preventDefault(e);
    }

    function disable_scroll() {
        if (window.addEventListener) {
            window.addEventListener('DOMMouseScroll', wheel, false);
        }
        window.onmousewheel = document.onmousewheel = wheel;
        document.onkeydown = keydown;
    }

    function enable_scroll() {
        if (window.removeEventListener) {
            window.removeEventListener('DOMMouseScroll', wheel, false);
        }
        window.onmousewheel = document.onmousewheel = document.onkeydown = null;
    }

 

分享到:
评论

相关推荐

    js实现鼠标滑动到某个div禁止滚动

    关于如何使用JavaScript实现当鼠标滑动到指定的div区域内时禁止页面滚动的功能,这是一个在前端开发中可能会遇到的实际需求。通常这种需求是在特定的操作场景中为了提供更好的用户体验而提出的。例如,在一个产品...

    perfect scrollbar jQuery鼠标滚轮滚动事件

    在"perfect scrollbar jQuery鼠标滚轮滚动事件"中,我们将探讨如何利用这个插件来处理鼠标的滚轮滚动事件,以及它与jQuery的交互。 首先,我们需要了解Perfect Scrollbar的基本使用方法。在引入jQuery库和Perfect ...

    滚动条响应鼠标滑轮事件实现上下滚动的js代码

    鼠标滑轮滚动就是一个事件,它可以被JavaScript代码监听到并作出相应的响应。 不同浏览器对事件的处理方式有所不同。在IE、Opera和Chrome这些浏览器中,可以使用"mousewheel"事件来监听鼠标滑轮滚动;而在Firefox中...

    openlayers的鼠标滚轮事件

    ### OpenLayers中的鼠标滚轮事件控制 #### 一、引言 在Web地图应用开发过程中,用户交互体验是至关重要的一个方面。OpenLayers作为一个强大的开源JavaScript库,为开发者提供了丰富的功能来实现各种地图操作,包括...

    javascript实现禁止鼠标滚轮事件

    在这篇文章中,主要介绍了使用JavaScript禁止鼠标滚轮事件的技术细节,对于前端开发者来说,这是一个相当实用的技巧,尤其是在需要定制化页面交互行为时。下面将详细解释文章中的核心知识点。 首先,文章提到,在...

    js鼠标滑轮滚动事件绑定的简单实例(兼容主流浏览器)

    代码如下:/** Event handler for ... *鼠标滚动事件 */ var wheel = function(event) { var delta = 0; if (!event) /* For IE. */ event = window.event; if (event.wheelDelta) { /* IE/Opera. */ delta = ev

    阻止滚动条事件冒泡

    要实现这个功能,我们需要理解JavaScript事件冒泡的概念。在DOM中,事件会从最深的节点开始向上层节点传播,直到到达文档的根节点,这个过程就称为事件冒泡。阻止事件冒泡可以避免一个事件被多次处理,提高性能,...

    原生JS绑定滑轮滚动事件兼容常见浏览器

    滑轮滚动页面的事件在网页特效中进场遇到,但是在不同浏览器下的实现方式又不同。下面我实现的方法,兼容常见浏览器。 function getData(event){ var e = event || window.event; //获取滚动距离(FF每次滚动 data为...

    js获取鼠标滚轮滚动像素

    ### js获取鼠标滚轮滚动像素 #### 知识点概览 在JavaScript中,通过监听鼠标滚轮事件来获取滚轮滚动的像素是一项常见的需求。本文将深入探讨如何利用JavaScript来实现这一功能,并且会解释代码片段中的实现细节,...

    jquery监听鼠标滚轮事件+js监听滚轮事件

    本篇将详细介绍如何使用jQuery和原生JavaScript实现鼠标滚轮事件的监听。 一、jQuery监听鼠标滚轮事件 jQuery库提供了一种简洁的方式来处理DOM元素上的事件,包括滚轮事件。要监听滚轮事件,可以使用`$(element)....

    js实现图片的滑轮滚动放大预览、拖动、旋转

    在JavaScript(JS)中,实现图片的滑轮滚动放大预览、拖动和旋转功能是一项常见的交互设计任务,尤其在网页开发中应用广泛。这项功能可以让用户更直观、更自由地查看图片细节,提高用户体验。以下将详细讲解如何实现...

    jQuery鼠标滚动事件动画 jQuery鼠标滚动事件动画宣传页面.zip

    本项目"jQuery鼠标滚动事件动画 jQuery鼠标滚动事件动画宣传页面.zip"是利用jQuery实现的一种交互效果,特别是针对鼠标滚动事件的处理,用于创建动态且吸引人的宣传页面。这个压缩包包含了一个基于HTML5、CSS和...

    57、Jquery鼠标滚动事件动画

    本知识点将深入探讨如何利用jQuery实现鼠标滚动事件的动画效果。首先,我们来理解什么是鼠标滚动事件。 鼠标滚动事件是用户操作浏览器时触发的一种事件,通常发生在用户滚动页面时。在jQuery中,我们可以使用`$...

    js可随鼠标拖拽滚动的3D标签球

    在这个3D标签球中,JavaScript监听鼠标的移动和拖拽事件,然后根据这些事件更新3D场景中的标签位置,使得用户可以自由地旋转和滚动标签球。 ECMAScript是JavaScript的标准化规范,它的最新版本(ES6及以上)引入了...

    滑轮滚动图片跟随放大缩小

    总的来说,"滑轮滚动图片跟随放大缩小"是一个结合了JavaScript事件处理、CSS3动画和响应式设计的网页交互效果,它提升了网页的视觉吸引力,同时也对开发者提出了更高的技术和性能优化要求。通过深入理解和实践,我们...

    javascript鼠标事件大全

    ### JavaScript鼠标事件大全 在JavaScript编程中,鼠标事件是非常重要的交互元素之一,它们允许开发者捕捉用户的鼠标动作,并根据这些动作触发相应的脚本处理。本文将详细介绍JavaScript中的各种鼠标事件及其特性,...

    js 无缝滚动,鼠标放上去暂停代码

    ### JS 无缝滚动,鼠标放上去暂停代码 在前端开发中,实现文本或图片的无缝滚动效果是非常常见的需求之一,特别是在新闻网站、广告横幅等场景下。这种效果不仅可以提升用户体验,还能增加页面的吸引力。本文将详细...

    js焦点图片滚动切换插件标题和图片切换滚动

    在本文中,我们将深入探讨与“js焦点图片滚动切换插件”相关的知识点,包括原理、实现方式、常见问题及优化策略。 一、工作原理 焦点图片滚动切换插件主要基于JavaScript和CSS技术,通过定时器(setTimeout或...

    GSAP.JS视差层鼠标滚轮特效.rar

    在这个“GSAP.JS视差层鼠标滚轮特效.rar”压缩包中,我们可以预见到一个使用GSAP.js实现的视差滚动效果。视差滚动是现代网页设计中一种流行的技术,它通过使背景元素以不同的速度移动,从而创造出深度感和沉浸式的...

Global site tag (gtag.js) - Google Analytics