Admin Forum:Styling cross-browser scrollbar

Forums: Admin Central Index → Technical Help → Styling cross-browser scrollbar Wikia's forums are a place for the community to help other members. To contact staff directly or to report bugs, please use Special:Contact.

I modified scrollbar look using  script. But this is reserved for webkit browsers only. Thinking that most of people use IE for surfing, this settings would be rarely valid for my visitors. Isn't there any way to make it cross-browser compatible? I found some jQuery custom scrollbars on the internet but they contains too many unneeded functions that I'm afraid of installing them to my wiki. I'm wondering if there is anything simpler?


 * This is only for scrollboxes inside an article. For now I'm handeling it by class attribute ( etc.) I didn't mean to change the style in general of the scrollbars. (I'm saying this because I could sound not respecting any web conventions.)

Maybe try  for Opera browsers,   for Firefox,   for IE9+? — subtank  ( 7alk ) 22:08, May 12, 2012 (UTC)


 * I will go try that solution to see. Thanks for your advice.


 * I couldn't make it working, there's no change on IE9 and FF12.

.scrollbox::-webkit-scrollbar, .scrollbox::-moz-scrollbar, .scrollbox::-ms-scrollbar { width:12px; } .scrollbox::-webkit-scrollbar-track, .scrollbox::-moz-scrollbar-track, .scrollbox::-ms-scrollbar-track { -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3); } .scrollbox::-webkit-scrollbar-thumb, .scrollbox::-moz-scrollbar-thumb, .scrollbox::-ms-scrollbar-thumb { background: rgba(246,149,36,0.8); }

Yea... by the looks of it, it didn't work. I presume you've looked at this page when trying to figure out how to do it. Apparently, this old page shows that Firefox doesn't allow customisation and that the only way to circumvent this is through Javascript (or JQuery if you know how to do it). This page shows how to make it work in IE8 and IE9. Sorry if this is not that helpful. :/ — subtank  ( 7alk ) 23:36, May 12, 2012 (UTC)


 * Thank you for linking documentations. Now I'm planning to integrate this. Basically I only need to copy the following codes

  ...
 * and then the CSS. I'm not sure yet if this works on my site, but I'll try.