在 Chrome 中设置 HTM5 文本会终止滚动条拖动

Question

我在 Javascript 中有一个计时器，每秒触发一次以更新页面 (HTML5) 中的一些文本，如下所示：

document.getElementById('CountDown').innerHTML = "some string";

除了如果在用户拖动滚动条句柄时运行此代码，拖动将中止外，这工作正常。这是一个非常烦人的用户界面行为，我一直无法解决。

如果我注释掉计时器事件中的行，则滚动条会正常工作。

注意： 它只发生在 Chrome 上，不会发生在 Firefox 或 Opera 上。

知道如何解决这个问题吗？

Answer 1

可能不是您想听到的答案，但几个月前我遇到了这个问题，当 javascript 更新 [=20] 时，chrome 的平滑滚动功能有几个已知错误=].

Chrome 的较新版本似乎可以更好地处理这个问题。我在最新版本的 Chrome 上做了一个快速测试，代码与您的代码相似，没有问题。

如果您的代码在其他浏览器中运行良好，则似乎不太可能出现错误。可能最好建议用户确保 Chrome 已完全更新以获得网站上的最佳体验或使用其他浏览器。

Answer 2

平滑滚动是一个非常重要和有效的提升用户体验的功能，看来chrome浏览器中的平滑滚动有几个像你这样的案例，而且它不能正常工作，但这些问题在一定程度上与旧版本有关，例如：

您可以在 CSS 中尝试以下规则：

html, body { 
    overflow: hidden, 
    height: 100% 
}

对于您的容器，您可以附加以下规则：

{ 
    overflow: auto; 
    height: 100% 
}

相反，由于代码在其他浏览器中工作意味着您的代码有效，因此只需确保您使用的是最新版本之一，清除缓存并试一试。

Answer 3

现在似乎可以了 - Chrome 68.0.3440

发布后

Setting HTM5 text kills scrollbar drag in Chrome