如何从 Mozilla Firefox 隐藏滚动条？ [复制]

Posted 2023-03-06

【中文标题】如何从 Mozilla Firefox 隐藏滚动条？ [复制]

【英文标题】：How to hide scrollbar from mozilla firefox? [duplicate]

【发布时间】：2019-06-01 19:42:49

【问题描述】：

CSS 隐藏 Mozilla Firefox 的滚动条，因为我们可以将它隐藏在 chrome 中，例如：-

::-webkit-scrollbar

【问题讨论】：

这个问题对你有帮助：***.com/questions/20997183/…

【参考方案1】：

您可以执行以下操作

<div style='width: 100%;height:300px;'>
     <div style='height: 100%; overflow: auto; margin-right: -15px;'>
          //your overflowing content
     </div>
</div>

此处父 div 的高度取决于您的用例。

内部 div 中的 margin-right 属性是滚动条的宽度，可以通过 javascript 计算如下。

var div = document.createElement('div');
div.setAttribute('style', "width: 100%;height: 100%;position: absolute;overflow: auto;visibility: hidden;");
document.body.appendChild(div);
div.innerhtml = '<div style="width: 100%;height: 200%;"></div></div>';
var scrollWidth = div.offsetWidth - div.clientWidth;
div.parentNode.removeChild(div);
return scrollWidth;

您必须将返回的'scrollWidth'数据设置为负'ma​​rgin-right'到子容器。

这适用于所有浏览器。

注意：ma​​rgin-right 属性应设置检查内容是否溢出。否则你会遇到一些宽度问题。

【参考方案2】：

有很多方法：

 body 
          srollbar-width: none
       

---

::-webkit-scrollbar 

        background: transparent;