我必須隱藏元素的垂直滾動條，但我必須讓“滾動”繼續作業，例如使用滑鼠滾輪。
我關注了這篇文章：
.container {
overflow-y: scroll;
scrollbar-width: none; /* Firefox */
-ms-overflow-style: none; /* Internet Explorer 10 */
}
.container::-webkit-scrollbar { /* WebKit */
width: 0;
height: 0;
}
使用該代碼，我能夠隱藏兩個滾動條，但我無法保持水平滾動條可見。有誰知道怎么做。？
uj5u.com熱心網友回復：
您想顯示水平滾動條并隱藏垂直滾動條但同時使兩者都作業嗎？如果是這樣，您可以參考下面的代碼：
.content {
width: 400px;
height: 200px;
}
.container {
overflow-x: auto;
overflow-y: auto;
height: 100px;
width: 200px;
scrollbar-width: none;
/* Firefox */
-ms-overflow-style: none;
/* Internet Explorer 10 */
}
.container::-webkit-scrollbar {
height: 8px;
width: 0px;
border: 1px solid #fff;
}
::-webkit-scrollbar-track {
border-radius: 0;
background: #eeeeee;
}
::-webkit-scrollbar-thumb {
border-radius: 0;
background: #b0b0b0;
}<div class="container">
<div class="content">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor
in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</div>
</div>此代碼適用于 webkit 瀏覽器。但是對于 FireFox 和 IE，我們似乎只能隱藏或顯示兩個滾動條，因為它們無法自定義滾動條軌道和滾動條拇指。
轉載請註明出處，本文鏈接：https://www.uj5u.com/qita/418338.html
標籤：