滚动条显示在滚动上

Scrollbar Appear on Scroll

本文关键字:滚动 显示 滚动条      更新时间:2023-09-26

我最近看到一个网站有一个隐藏的滚动条,它出现在滚动上。这也可能是因为它是一个光滑的网格。我能够控制特定于div的滚动条CSS,但无法从javascript控制它。到目前为止,我的脚本非常简单:

$('#mydiv').scroll(function(){
    $('#mydiv::-webkit-scrollbar').fadeIn(500);
    //I've also tried .css() above and tried the .hover event as well
})

我的div 和滚动条 css:

#mydiv{overflow-x: hidden; overflow-y: auto; height: 80%; width: 100%;}
#mydiv::-webkit-scrollbar{display: none;}

有没有办法在滚动时显示滚动条?我已经知道如何通过在 css 中更改:hover溢出来控制悬停。

不需要插件,试试这个:

.JS:

$(window).bind('mousewheel', function(e) {
  var el = $('body');
  el.css('overflow-y', 'scroll');
  if (el[0].hideScroll) clearTimeout(el[0].hideScroll);
  el[0].hideScroll = setTimeout(function() {
    el.css('overflow-y', 'hidden');
  }, 500);
});

.CSS:

body {
  overflow-y: hidden;
}