在 Microsoft Edge 中,在任何网页上按住向下箭头键可以以令人难以置信的快速度向下滚动页面。虽然 Edge 是基于 Chromium 的,但 Google Chrome 不受此影响。
这里是一个使用 Lorem Ipsum250 段的示例。
在 Chrome 中,每秒向下滚动几段。在 Edge 中,每秒向下滚动数十个段落。
向上/向下箭头键在我们的 Edge 网站上带来了糟糕的用户体验。
我们如何使用 JavaScript 控制 Edge 中我们网站的滚动速率?
边缘:
铬:
if(window.navigator.userAgent.indexOf('Edg') > -1) {
document.onkeydown = slowScroll;
window.lastScrolledUp = 0;
window.lastScrolledDown = 0;
window.lastScrolledLeft = 0;
window.lastScrolledRight = 0;
}
function slowScroll(e) {
var now = Date.now(),
minDelay = 100;
switch(e.keyCode) {
// Up
case 38:
if(now - window.lastScrolledUp < minDelay) {
e.preventDefault();
return;
}
window.lastScrolledUp = now;
break;
// Down
case 40:
if(now - window.lastScrolledDown < minDelay) {
e.preventDefault();
return;
}
window.lastScrolledDown = now;
break;
// Left
case 37:
if(now - window.lastScrolledLeft < minDelay) {
e.preventDefault();
return;
}
window.lastScrolledLeft = now;
break;
// Right
case 39:
if(now - window.lastScrolledRight < minDelay) {
e.preventDefault();
return;
}
window.lastScrolledRight = now;
break;
}
}
上面的代码成功减慢了 Edge 中快得离谱的滚动速度。这对我们有用,因为它用于我们控制的 Intranet 站点。它可能不适合公众可以访问的网站(并且可能会更改 Edge 标志)。