webkit scrollbar с прозрачным фоном

Question

У меня есть небольшой список с контентом, который я хочу сделать с max-height и прокруткой, но есть одна проблема. Я хочу сделать это обычным списком прокрутки. Там мой JSFiddle. Я не могу установить прозрачный фон и цвет дорожки

Существует мой Scrollbar CSS

.uploaded-files::-webkit-scrollbar{ 
    -webkit-appearance: none; 
    width: 11px; 
} 

.uploaded-files::-webkit-scrollbar-track{ 
    margin: 7px 0; 
} 

.uploaded-files::-webkit-scrollbar-thumb{ 
    border-radius: 12px; 
    border: 4px solid rgba(255,255,255,0); 
    background-clip: content-box; 
    background-color: #a0a0a0; 
} 

Я хочу сделать скроллбар, как это в этом образе

Любые решения ?

Answer 1

Im используя jQuery scrollbar сейчас, и она работает очень хорошо, и это мое решение, на мой собственный вопрос.

Answer 2

Я сделал что-то, что хочу, но как установить границу с боков, и все же он не прозрачен.

https://jsfiddle.net/Lfygvv3t/3/

Теперь мой CSS выглядеть как этот

.uploaded-files::-webkit-scrollbar-track{ 
    border-radius: 10px; 
    margin:7px 0; 
    background-color: rgba(27, 30, 50, 0.15); 
} 

.uploaded-files::-webkit-scrollbar{ 
    width: 3px; 
    background-color: transparent; 
} 

.uploaded-files::-webkit-scrollbar-thumb{ 
    border-radius: 10px; 
    background-color: rgba(27, 30, 50, 0.3); 
}