Scrollbar Effect!
Hello guys, I have a question searched for it and unfortunately could not find the answer!
Here i have the page scrollbar, how i can get the content behind the scrollbar (the scroll bar is transparent) as example the green thing is part of background image, i want the scrollbar to be on the background image as well as shows part of it through its transparency .
Thanks in advance!
14 Replies
More explain, i want the background to use that space
scrollbar styling on the web is a bit of a dumpster fire.... Can you share what code you have so far?
Regarding the scrollbar thats all
i tried a lot of stuff to make it be above the content instead of taking some space
i think the official
scrollbar-color property gives the effect you want but will only work in Firefox for now: https://codepen.io/jsnkuhn/pen/eYxWoBr
is the issue that the -webkit-scrollbar-track is just not accepting the transparent?it didnt do anything in both firefox and chrome
i want it like this
wait
the content to go behind the scroll bar, in the way i have done the transpearnacy working
as well as the opacity
it worked on codepin 🤔
ahh ok, so the transparent is probably working but the scrollbar is added to the right of the element and not overlaying it?
ye
so this suggests
overflow: overlay; never heard of it but it's worth a try https://stackoverflow.com/questions/57862671/how-to-make-scroll-bar-overlay-content
in all honestly your probably better off using a js library for thishmmm ooki thanks! can u gimme a suggestion ? dont know about which one that can help me with that
the one they recommend in the post seems to work: http://grsmto.github.io/simplebar/
Thanks i'll try it late and see!