用css怎么实现Mac Chrome下默认的滚动条样式?

Question

在Mac Chrome下, 默认的滚动条完全不占位, 是漂浮的, 透明的.

使用css自定义滚动条样式时, 能否实现这样的效果, 不占位, 透明

Answer 1

也遇到这个问题，题主解决了没有

Answer 2

overflow:auto

Answer 3

::-webkit-scrollbar {
  background: rgba(0, 0, 0, 0);
  width: 4px;
  height: 4px;
}
::-webkit-scrollbar-thumb {
  background: rgba(37, 36, 36, 0.57);

可能需要自己再根据需求调下颜色

Answer 4

给你看一个别人写的自定义滚动条 https://github.com/echosoar/g... 将滚动条设置为 absolute 脱离文档流应该就不占位了

Answer 5

外国友人写了一个插件，可以隐藏滚动条：nicescroll

Answer 6

我总觉得 你需要的是iscroll

Answer 7

::-webkit-scrollbar{
  width: 4px;
  height: 4px;
}
::-webkit-scrollbar-thumb{
  border-radius: 1em;
  background-color: rgba(50,50,50,.3);
}
::-webkit-scrollbar-track{
  border-radius: 1em;
  background-color: rgba(50,50,50,.1);
}

Answer 8

作者后来实现了，我做组件化开发也要实现这个