Jquery 在滚动条上显示滚动条，否则将其隐藏，并将其z索引置于首位

说明

如果用户没有在页面上滚动，我想隐藏滚动条。一旦他开始在页面上滚动，滚动条就应该可见

此代码允许我在滚动开始时执行任何操作

$("#element").on("scroll",function(){});

让我向div添加一个类，其中

-webkit-scrollbar
{
    width: 0px !important;
}

这个css实际上隐藏了这个条

问题

当用户滚动时，会显示该条，但在滚动的俯冲中会占用一点空间，这也会干扰其他俯冲的放置

我想要什么

我想要的是在scroll上显示滚动条，但要以某种方式更改其z索引，以便在显示时不会占用div中的空间

到目前为止我做了什么

我已经设计了滚动条的样式 当用户滚动时，它的显示/隐藏切换工作剩下的就是我上面讨论的问题。。。有人熟悉吗？？？

你说……）

---

我发现唯一一种非常容易做到的方法是使用一个预定义的空间来显示滚动条。现在，在不干扰衬垫、位置、包装等的情况下，最简单的解决方案是：

使滚动条透明

因此，默认情况下，添加一个“透明”滚动条元素的类：

<div id="element" class="hideScroll"></div>

滚动删除该类（应用默认样式）

---

并在所需的超时后重新添加。

“在滚动条出现的地方使用预定义的空间”这是我要查找的行。。。谢谢你，你真是太棒了：）

.hideScroll::-webkit-scrollbar{
  background:transparent;
}
.hideScroll::-webkit-scrollbar-thumb {
  background: transparent;
}

var scrollTimeout;
$(".hideScroll").on("scroll",function(){
  clearTimeout(scrollTimeout);
  var $that = $(this);

  $that.removeClass('hideScroll');
  scrollTimeout = setTimeout(function(){
     $that.addClass('hideScroll');
  },220);
});