如何从阻止滚动的元素中消除抖动[关闭]答案

【问题标题】：How to remove jitter from elements on which scrolling is prevented [closed]如何从阻止滚动的元素中消除抖动[关闭]
【发布时间】：2012-12-28 01:43:01
【问题描述】：

请先看看另一个问题：Mouse wheel scroll event 和 the demo from the accepted answer。

如何减少滚动事件取消时的抖动？

【问题讨论】：

标签： javascript jquery mouseevent mousewheel

【解决方案1】：

演示：http://jsfiddle.net/HUGTL/

在answer to your original question 的基础上，您可以执行以下操作：

var noscroll = document.getElementById('noscroll');

var locked, lockedX, lockedY;
noscroll.addEventListener('mouseover', function (){
    locked = true;
    lockedX = window.scrollX;
    lockedY = window.scrollY;
}, false);
noscroll.addEventListener('mouseout', function (){
    locked = false;
}, false);

// changes

$(window).on("mousewheel keydown", function(e){
    if(locked === true){
        return false;
    }
});

$(window).on("scroll", function(e){
    if(locked === true){
        // add fallback here for other scenarios
    }
});

我正在使用 jQuery 来简化/标准化事件处理。

请注意，防止关键事件可能是不可取的；我将其包括在内是为了展示如何防止箭头键（您也可以检查特定的键码）。

我还为mousewheel/keydown 未处理的场景添加了一个通用后备处理程序。

这可能对触摸事件不起作用（或根本不起作用）。最重要的是，确保它不会让您的用户感到困惑或删除预期的功能。

如果你只想处理鼠标滚轮，可能会简单很多：

$("#noscroll").on("mousewheel", function(e){
    return false;
});

演示：http://jsfiddle.net/HUGTL/3/。但是，这不适用于关键事件。

【讨论】：

花费的时间有点长，我试了一下，结果一样。问题是如何减少滚动事件取消时的抖动？就像在地图中，当我滚动时鼠标滚轮，页面没有抖动效果。
我认为唯一的方法是在滚动发生之前取消事件（例如返回 false onmousewheel/keydown）。滚动开始后，我找不到平滑它的方法。
好的，我知道你的意思了。谢谢你的建议，我试试看。
关于地图（至少是谷歌地图）看起来他们处理了所有的事件，并且从不让它们冒泡到窗口进行滚动。因此它们响应鼠标滚轮、单击、拖动等。移动地图并返回 false。
这就是我想做的最终效果，哈哈。