透明滚动条与css [英] Transparent scrollbar with css

问题描述

现在使用这个代码（和许多变体），但滚动轨道获得深灰色的颜色，像＃222222或附近。找到很多例子，但是所有的例子都给出相同的结果。 Opera，Chrome和firefox显示此错误。怎么修？

Now use this code(and many variations of this), but scroll track get dark-grey color, something like #222222 or near this. Find many examples, but all of them give same result. Opera, Chrome and firefox show this bug. How to fix?

#style-3::-webkit-scrollbar-track
{
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
    background-color: transparent;
}

#style-3::-webkit-scrollbar
{
    width: 6px;
    background-color: transparent;
}

#style-3::-webkit-scrollbar-thumb
{
    background-color: #000000;
}

推荐答案

可能使其透明。您必须使用这样的透明背景图片：

With pure css it is not possible to make it transparent. You have to use transparent background image like this:

::-webkit-scrollbar-track-piece:start {
    background: transparent url('images/backgrounds/scrollbar.png') repeat-y !important;
}

::-webkit-scrollbar-track-piece:end {
    background: transparent url('images/backgrounds/scrollbar.png') repeat-y !important;
}

这篇关于透明滚动条与css的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！