隐藏滚动条,同时仍然可以使用鼠标/键盘滚动

IT技术 javascript jquery html css
2021-02-10 14:21:02

可能的重复:
如何禁用浏览器或元素滚动条,但允许使用滚轮或箭头键滚动?

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

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

3个回答

为了将来参考,还有一个没有 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";

请参阅演示或完整的HOWTO

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

@cocoacoder 如果您想知道的话,您可以随时在不同的浏览器和移动设备中尝试它……我在 iOS 和 IE9 上进行了测试,它运行良好。这种方法没有什么太hacky的,所以它应该是非常交叉兼容的。只要平台支持 scrollWidth 属性,它就可以正常工作。
2021-03-19 14:21:02
似乎世界上所有浏览器都支持它:w3schools.com/jsref/prop_element_scrollwidth.asp
2021-03-27 14:21:02
很好,但是浏览器和移动设备兼容性如何?
2021-04-11 14:21:02

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

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