描述
如果用户不在页面上滚动，我想隐藏滚动条。他开始在页面上滚动时，滚动条应立即可见。
滚动开始时，此代码可让我执行任何操作
$("#element").on("scroll",function(){});
我可以在div中添加一个类
-webkit-scrollbar
{
width: 0px !important;
}
这个CSS真的把酒吧藏起来了。
问题
当用户滚动时，该条会显示出来，但是在潜水中会占用一点空间，这也会干扰其他div的放置。
我想要的是
我想要的是在滚动条上显示滚动条，但是以某种方式更改了它的z-index，以便在显示时不会占用div中的空间...。
到目前为止我做了什么
当用户滚动剩下的所有内容时，我已经设置了滚动条的显示/隐藏切换样式，这是我上面已经讨论的问题……有人熟悉吗？
Chrome你说... :)
我发现真正容易做到的唯一方法是使用将在其中显示滚动条的预定义空间。现在，在不弄乱填充，位置，包装等的情况下，最简单的解决方案是：
使滚动条透明！
因此，默认情况下，添加一个“透明”滚动条元素的类：
<div id="element" class="hideScroll"></div>
CSS：
.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);
});
并在所需的超时后重新添加。
本文收集自互联网，转载请注明来源。
如有侵权，请联系[email protected] 删除。
我来说两句