“溢出：隐藏”在“身体”上使用 USB 鼠标产生毛刺滚动条
ryz*_*yzh 4 css mouse google-chrome overflow scrollbar
我正在构建一个 Web 应用程序并使用 Google Chrome 进行测试。我有一个侧边栏元素，如果我将鼠标悬停在该元素上，我想禁用该body元素的滚动。
我通过overflow: hidden在body用户悬停在侧边栏上时使用 CSS设置标签来实现这一点。我在没有插入 USB 鼠标的浏览器上对此进行了测试，效果很好：
侧边栏关闭（body滚动条可见）
侧边栏打开 - 不好（body滚动条仍然可见，产生难看的重叠）
侧边栏打开 - 很好（我的修复：隐藏body滚动条，以便侧边栏滚动条单独显示）
这是有效的，因为谷歌浏览器不会将滚动条呈现为实际元素（具有宽度）。但是，当我插入 USB 鼠标时，滚动条现在确实有宽度。因此，当我将鼠标从滚动条外部移动到滚动条内部时，宽度突然改变：
悬停之前（body滚动条可见）
悬停后 - 坏 （body滚动条隐藏，突然减少整个侧边栏的宽度）
这会产生一种非常丑陋和毛刺的视觉效果，当您将鼠标悬停在元素上时，元素的宽度会发生变化。我到处寻找解决方案......任何帮助将不胜感激！非常感谢！
如果您使用的是 mac，则您的操作系统可能会在您插入鼠标时添加滚动条，滚动条将覆盖大多数 CSS 选择器。
没有办法用我知道的 CSS 覆盖它。如果您更改系统首选项，您会发现您的网站按您预期的方式运行。
System Preferences -> General -> Show Scroll Bars -> Change from [ALWAYS] to [WHEN SCROLLING]
