HTML5: Your visual blueprint™ for designing rich web pages and applications

CUSTOMIZE A SCROLL BAR WITH IMAGES

You can create a custom scroll bar on any display block that has the overflow property set. This can be used to replace the bland scroll bar that is built into the browser’s operating system. This feature is supported in only the desktop WebKit browsers Chrome and Safari; WebKit introduced the feature, and it is not yet included in CSS3:

selector { overflow: auto; display: block;
width: windowwidth; height: windowheight; };
::-webkit-scrollbar { width: scrollbarwidth;
height: scrollbarheight; };

windowwidth and windowheight are length values indicating the size of the scrollable window that you want to create. scrollbarwidth and scrollbarheight represent the maximum width of the vertical scroll bar and maximum ...