隐藏滚动条，同时仍然可以使用鼠标/键盘滚动[重复]答案

【问题标题】：Hide scrollbar while still being able to scroll with mouse/keyboard [duplicate]隐藏滚动条，同时仍然可以使用鼠标/键盘滚动[重复]
【发布时间】：2011-03-18 15:27:03
【问题描述】：

可能重复：
How to disable browser or element scrollbar, but allow scrolling with wheel or arrow keys?

我想知道是否可以隐藏滚动条，同时仍然可以使用鼠标/键盘进行滚动。

我尝试使用 CSS：overflow: hidden;。效果是禁用滚动条和禁用滚动。

【问题讨论】：

标签： javascript jquery html css

【解决方案1】：

为了将来参考，还有一个不使用 jQuery 的解决方案 - 只需让包装器 div 样式包含 overflow:hidden 并使用此 JavaScript 两行代码：

// get the width of the textarea minus scrollbar
var textareaWidth = document.getElementById("textarea").scrollWidth;

// width of our wrapper equals width of the inner part of the textarea
document.getElementById("wrapper").style.width = textareaWidth + "px";

请参阅demo 或完成HOWTO。

更新：您可以使用相同的原理创建没有滚动条的可滚动div：demo。

【讨论】：

不错，但浏览器和移动设备的兼容性如何？
@cocoacoder 如果您想知道的话，您可以随时在不同的浏览器和移动设备中尝试...我在 iOS 和 IE9 上进行了测试，它运行良好。这种方法没有什么太奇怪的地方，所以它应该是非常交叉兼容的。只要平台支持 scrollWidth 属性，它就可以正常工作。
好像全世界的浏览器都支持它：w3schools.com/jsref/prop_element_scrollwidth.asp

【解决方案2】：

有一个名为 Scrollable 的 jQuery 插件可以满足您的需求。

【讨论】：

【解决方案3】：

不是原生的，但我想您可以通过使用 Javascript 来实现自己的滚动机制来捕获某些击键并使用 CSS 相应地重新定位容器元素。不过会很丑！

【讨论】：