How to create a customize scoll bar

Hi all, I’m having a quick question: is it possible to create a special scoll bar like below using Javascript and HTML…

< (1) —–(4)———– (11) >

In brief, the scroll bar is used to navigate a list of image which will place above or below the bar. As shown above, I want to draw “1” between the left arrow and the bar, and to draw the number of image between the right arrow and the bar, and to draw the current image position (e.g. “4” for the fourth image in position) on the scroll thumb. Also, if possible, the list of images will scroll SMOOTHLY by dragging the thumb using the scroll arrows.

Ok, is all these possible at all?

Thank you

Also in #JavaScript _↴