我怎样才能禁用浏览器或元素的滚动条，但仍然允许滚动轮或方向键？
我想隐藏我的div元素和我整个body任何滚动条，但仍然让用户滚动鼠标滚轮或方向键。 这怎么可以用原始的JavaScript或jQuery来实现？ 有任何想法吗？
像以前的答案一样，您可以使用overflow:hidden来禁用正文/ div上的滚动条。
然后，将mousewheel事件绑定到一个函数，该函数将更改div的scrollTop以模拟滚动。
对于箭头键，您可以绑定keydown事件以识别箭头键，然后根据需要更改div的scrollTop和scrollLeft以模拟滚动。 （注意：您使用keydown而不是keypress因为IE不能识别方向键的按键。）
编辑：我不能让FF / Chrome来识别div上的keydown ，但它在IE8中工作。 根据你所需要的，你可以在document上设置一个keydown监听器来滚动div。 （查看keyCode参考的例子。）
例如，使用鼠标滚轮滚动（使用jQuery和鼠标滚轮插件）：
<div id="example" style="width:300px;height:200px;overflow:hidden"> insert enough text to overflow div here </div> <script> $("#example").bind("mousewheel",function(ev, delta) { var scrollTop = $(this).scrollTop(); $(this).scrollTop(scrollTop-Math.round(delta)); }); </script>
（这是一个快速的模型，你必须调整数字，因为对我来说，这个滚动慢一点。）
keyCode引用
鼠标滚轮插件
keydown，keypress @ quirksmode
2012年12月19日更新：
mousewheel插件的更新位置是： https ： //github.com/brandonaaron/jquery-mousewheel
纯粹的CSS解决scheme呢？ 我已经testing了这个，它工作正常。 不过，我会推荐解决scheme3，因为它不是黑客，所有浏览器都支持JS，而且非常简单。
解决scheme1 （跨浏览器，但更hacky）
<html> <head> <style type="text/css"> #div {position: fixed; bottom: 60px; left: 20px; right: -20px; padding-right: 40px; top: 80px; background-color: black; color: white; overflow-y: scroll; overflow-x: hidden;} </style> </head> <body> <div id="div"> Scrolling div with hidden scrollbars! On overflow, this div will scroll with the mousewheel but scrollbars won't be visible. </div> </body> </html>
解决scheme2 （仅限IE和Chrome）
只需将nobars类添加到要隐藏滚动条的任何元素即可。
Firefox的overflow: -moz-scrollbars-none 根据MDN ， overflow: -moz-scrollbars-none是过时的。 它曾经工作，但现在隐藏溢出，并禁用滚动，如果使用。
.nobars { /* Firefox: https://developer.mozilla.org/en/docs/Web/CSS/overflow */ /* overflow: -moz-scrollbars-none; (no longer works) */ /* IE: https://msdn.microsoft.com/en-us/library/hh771902(v=vs.85).aspx */ -ms-overflow-style: none; } .nobars::-webkit-scrollbar { /* Chrome: https://css-tricks.com/custom-scrollbars-in-webkit/ */ display: none; }
解决scheme3 （跨浏览器JavaScript）
完美的滚动条不需要jQuery（虽然它可以利用jQuery，如果安装），并有一个演示在这里 。 这些组件可以使用css来设置样式，如下例所示：
.ps-scrollbar-y-rail { display: none !important; }
这是一个完整的例子，包括Perfect Scrollbar的实现：
<link rel="stylesheet" href="css/perfect-scrollbar.min.css"> <style> #container { position: relative; /* can be absolute or fixed if required */ height: 200px; /* any value will do */ overflow: scroll; } .ps-scrollbar-y-rail { display: none !important; } </style> <script src='js/perfect-scrollbar.min.js'></script> <div id="container"> Scrollable<br>Scrollable<br>Scrollable<br>Scrollable<br>Scrollable<br>Scrollable<br>Scrollable<br>Scrollable<br>Scrollable<br>Scrollable<br>Scrollable<br>Scrollable<br>Scrollable<br>Scrollable<br>Scrollable<br>Scrollable<br>Scrollable<br>Scrollable<br>Scrollable<br>Scrollable<br>Scrollable<br>Scrollable<br>Scrollable<br>Scrollable<br>Scrollable<br>Scrollable<br>Scrollable<br>Scrollable<br>Scrollable<br>Scrollable<br>Scrollable<br>Scrollable<br>Scrollable<br>Scrollable<br>Scrollable<br>Scrollable<br>Scrollable<br>Scrollable<br>Scrollable<br>Scrollable<br>Scrollable<br>Scrollable<br> </div> <script> // on dom ready... var container = document.getElementById("container"); Ps.initialize(container); //Ps.update(container); //Ps.destroy(container); </script>
我更喜欢SamGoody的答案提供给这个问题的副本。 它使原生滚动效果保持不变，而不是试图手动重新实现几个特定的input设备：
一个更好的解决scheme是设置目标div溢出：滚动，并将其包裹在第二个8像素较窄，溢出：隐藏的元素。
看到原始的评论为一个充实的例子。 您可能希望使用JavaScript来确定滚动条的实际大小，而不是像他的例子那样假定它们总是8px宽。
你不必使用jquery或js来做到这一点。 它更简单的webkit的性能。
只需将下面的代码添加到您的css文件。
::-webkit-scrollbar { display: none; }
注意！ 这将禁用所有的滚动条，所以一定要把它放在一个特定的类或id，如果你只是想隐藏一个。
为了让我的工作，我用这个CSS：
html { overflow-y: hidden; }
但我有使用$(this).scrollTop() ，所以我绑定了我的#id，但调整了窗口的scrollTop。 另外，我平滑的滚动鼠标会发射很多1或-1的三angular洲，所以我乘以20。
$("#example").bind("mousewheel", function (ev, delta) { var scrollTop = $(window).scrollTop(); $(window).scrollTop(scrollTop - Math.round(delta * 20)); });
正如Baldráni所说的那样
::-webkit-scrollbar { display: none; }
或者你可以做
::-webkit-scrollbar{ width: 0px; }
（张贴给其他人从谷歌search绊倒！）
好吧，也许不是我觉得最直观的，但我可以想象你能够做出一个体面的体验，试试这个。
overflow:hidden;
确保父对象有一个height和width ，并显示为block
