如何在靜態時隱藏 Chromium 中的滾動條，但在滾動時顯示？

Question

是否可以在靜態時隱藏滾動條，但在滾動時顯示？

我根據這篇文章嘗試了以下 css，但滾動期間沒有顯示滾動條。

::-webkit-scrollbar { 
  display: none; 
}

還有另一篇文章在 Firefox 上實現了類似的功能，但不是 Chromium。

最好能通過css實現這個功能。

Answer 1

設置一個計時器來顯示滾動條，並在滾動事件中重置計時器並顯示滾動條：

var el = document.body; // you can use the following code on any element
var showScrollbarTimeout = 0; // track the timeout function so that we can reset it later

function hideScroll () { el.style.overflow = "hidden"; }
function showScroll () { el.style.overflow = "visible"; }

function hideLater () { showScrollbarTimeout = setTimeout(hideScroll, 1000); }

hideLater();

el.onscroll = function () {
    clearTimeout(showScrollbarTimeout);
    showScroll();
    hideLater();
}