Webkit Scrollbars not accepting RGBa values?

Question

I am styling some scrollbars on a webpage for webkit, and I want the track to be semi-transparent so that some of the background image bleeds through, but when I insert an RGBa value, it treats it just like an RGB value (without any alpha-channel). Does ::-webkit-scrollbars not accept RGBa? I know it doesn't accept anything like transitions, so did WebKit skip out on other cool effects too?

Code:

::-webkit-scrollbar {
    -webkit-appearance: none;
    width: 8px;
}

::-webkit-scrollbar-track {
    background-color: rgba(57,57,57, .6);
    border-radius: 8px;
}
::-webkit-scrollbar-thumb {
    border-radius: 8px;
    background-color: rgba(156, 156, 156, .6);
}

(But - on my side - it is treating rgba as just a plain rgb value)

Answer 1

Checkout my vertical jsfiddle for doing it with a vertical page. I setup a transparent track with a background image with the following:

::-webkit-scrollbar-track {
    background: rgba(57,57,57, .6);;
}

For a horizontal page, checkout this horizontal fiddle. The difference with the horizontal code is I setup the page to be 100% height:

body, html, .scrolls {
    height: 100%;   
}

Then I wrapped the page content in a div, which is where the scrolling will happen, not on the page itself, like so:

.scrolls { 
    overflow-x: scroll;
    overflow-y: hidden;
    white-space:nowrap;
    background-image: url('http://www.evokia.com/images/large-background.jpg');
} 

This is the workaround for the fact that it appears that the horizontal scroll on the page never gets the background of the page, so in order to get the transparent track we needed to create the scroll in the page.