Question

有没有办法完全摆脱滚动轨道？或者让它覆盖内容而不是将其推到一边？像iOS / Lion滚动条一样？

以下内容非常接近，但即使轨道是透明的，也会推动可滚动区域的内容并显示页面背景。

::-webkit-scrollbar {  
    width:8px;
    height:8px;
    -webkit-border-radius: 4px;
}

::-webkit-scrollbar-track,
::-webkit-scrollbar-track-piece {
    background-color:transparent;
}

::-webkit-scrollbar-thumb {  
    background-color: rgba(053, 057, 071, 0.3);
    width: 6px;
    height: 6px;
    -webkit-border-radius:4px;
}

Answer 1

嗯，我以为我之前回答过这个，也许不是：

隐藏身上的溢出物
用div包裹网站的整个内容或任何你正在滚动的内容，
Incude css属性 div（overflow：scroll或overflow-y：scroll）。

现在您可以使用rgba（0,0,0,0.3）将轨道css设置为任何不透明度，因为滚动不是正文的一部分。

如果要进行实验，另一个自定义firefox滚动条的提示是：

执行溢出操作并将滚动条（通过z-index）覆盖为您喜欢的任何颜色的透明div，
将div放在整个滚动部分上（可能是位置：绝对;右：0;如果你正在使用整个窗口的滚动）
使用指针事件：无;在divs css上使它变得半透明。

它会给firefox滚动一点颜色/纹理。（可能是迫使向右滚动以实现可比性的理想选择）

我还没有尝试过但是可行的

webkit css滚动条样式

1 个答案: