我有一个materialized tab menu，我想在那里实现Overlay Scrollbars，因为默认滚动条（当选项卡对于屏幕而言太宽时）看起来并不好。
在安装overlay scrollbars并将其添加到我的项目中之后，我可以在任何垂直滚动条上正常使用它。但是，一旦我尝试将其添加到水平选项卡中（用于我的选项卡），它会在此处初始化垂直滚动条并重命名许多元素，这使得选项卡不再起作用（动画等）
仅需澄清；
这是MaterializeCSS正常工作的HTML布局的方式：
<ul class="tabs tabs-transparent tabs-fixed-width">
<li class="tab"><a href="/a" target="_self" class="active">a</a></li>
<li class="tab"><a href="/b" target="_self">b</a></li>
<li class="tab"><a href="/c" target="_self">c</a></li>
<li class="tab"><a href="/d" target="_self">d</a></li>
<li class="tab"><a href="/e" target="_self">e</a></li>
<li class="tab"><a href="/f" target="_self">f</a></li>
<li class="tab"><a href="/g" target="_self">g</a></li>
<li class="indicator" style="left: 0px; right: 359px;"></li>
</ul>
Overlay Scrollbars就是这样的：
<ul class="tabs tabs-transparent tabs-fixed-width os-host os-theme-dark os-host-overflow os-host-overflow-y os-host-resize-disabled os-host-scrollbar-horizontal-hidden os-host-transition">
<div class="os-resize-observer-host">
<div class="os-resize-observer observed" style="left: 0px; right: auto;"></div>
</div>
<div class="os-size-auto-observer" style="height: calc(100% + 1px); float: left;">
<div class="os-resize-observer observed"></div>
</div>
<div class="os-content-glue" style="width: 454px; margin: 0px; height: 96px;"></div>
<div class="os-padding">
<div class="os-viewport os-viewport-native-scrollbars-invisible" style="right: 0px; overflow-y: scroll;">
<div class="os-content" style="padding: 0px; height: auto; width: 100%;">
<li class="tab"><a href="/a" target="_self">a</a></li>
<li class="tab"><a href="/b" target="_self">b</a></li>
<li class="tab"><a href="/c" target="_self">c</a></li>
<li class="tab"><a href="/d" target="_self">d</a></li>
<li class="tab"><a href="/e" target="_self">e</a></li>
<li class="tab"><a href="/f" target="_self">f</a></li>
<li class="tab"><a href="/g" target="_self">g</a></li>
</div>
</div>
</div>
<div class="os-scrollbar os-scrollbar-horizontal os-scrollbar-unusable">
<div class="os-scrollbar-track os-scrollbar-track-off">
<div class="os-scrollbar-handle" style="width: 100%; transform: translate(0%, 0px);"></div>
</div>
</div>
<div class="os-scrollbar os-scrollbar-vertical">
<div class="os-scrollbar-track os-scrollbar-track-off">
<div class="os-scrollbar-handle" style="height: 50%; transform: translate(0px, 0%);"></div>
</div>
</div>
<div class="os-scrollbar-corner"></div>
</ul>
（它还从活动页面中删除了活动类。这是我所需要的。）
我确实知道Overlay Scrollbars必须做出一些改变。但是有办法使这项工作吗？还是有其他选择？我真的不希望使用默认的滚动条。做些简单的事情就可以。
我已经看过一个不同的框架：Simplebar唯一的问题是它不支持更改HTML元素的默认滚动条。在我眼中，这是必须更改的东西，因为它会将我的内容推到需要滚动条的页面中（而且不；我不想一直显示滚动条。）
如果我错过了什么，请告诉我，我将更新此帖子。