Search code examples
javascripthtmlcssscrollbar

How to create a custom scrollbar on a div (Facebook style)

I'm wonder how the custom scrollbar on Facebook has been made.

Is it only css or some javascript as well?

If yes can i have an idea of what the code looks like?

This question is specific to Facebook scrollbar style and not how to simply have a custom scrollbar

Solution

  • This link should get you started. Long story short, a div that has been styled to look like a scrollbar is used to catch click-and-drag events. Wired up to these events are methods that scroll the contents of another div which is set to an arbitrary height and typically has a css rule of overflow:scroll (there are variants on the css rules but you get the idea).

    I'm all about the learning experience -- but after you've learned how it works, I recommend using a library (of which there are many) to do it. It's one of those "don't reinvent" things...