How to customize scroll bar in Chrome?

3

I have a select multiple combo that can not take up a lot of vertical space, so the ideal would be to scroll down with that traditional little set to navigate 1 in 1 item down.

Is there any way to force the traditional scroll, with javascript / jquery and / or css, or in the html itself?

NOTE: I call traditional any scrollbar style that has the button at the bottom and top for the user to click and go up / down the line.

    
asked by anonymous 27.02.2014 / 20:57

2 answers

6

I researched and found a solution. I discovered that it is possible to customize the bar with these CSS properties:

Setting properties:

The scroll bar in general:

::-webkit-scrollbar{width:15px; }

The up / down buttons:

::-webkit-scrollbar-button{background-color:#bfbfbf; height:15px;}

From the background behind the scroll bar:

::-webkit-scrollbar-track-piece {background-color:#e4e4e4;}

Vertical scrollbar:

::-webkit-scrollbar-thumb:vertical{background-color:#bfbfbf; border-top:1px solid #a4a4a4; border-bottom:1px solid #a4a4a4}

Horizontal scrollbar:

::-webkit-scrollbar-thumb:horizontal{background-color:black;}

Bottom (vertical bar) button:

::-webkit-scrollbar-button:vertical:increment {background-image:url("Imagens/seta-baixo.png");}

Top button (from the vertical bar):

::-webkit-scrollbar-button:vertical:decrement {background-image:url("Imagens/seta-cima.png");}

Result:

    
27.02.2014 / 21:16
0

jScrollPane can solve your problem.

link

See the example for what you need in the following link:

link

    
27.02.2014 / 21:16