Dodawanie strzałek scrollBar

Question

Próbuję dodać strzałki do x i y osi przewijania, oto moja przewijania: http://jsfiddle.net/Nk3NH/ I chcę tę strzałkę (image) na dwóch osiach: http://i.imgur.com/ygGobeC.png szukam kod dodający takie strzały, , a nie w górę iw dół.

Answer 1

Grałem się z nim dla ciebie. Najpierw ustawiłem przyciski na 10px x 10px, aby było to łatwiejsze, i utworzyłem 4 10 na 10 strzałek wskazujących w lewo, w prawo, w górę iw dół. Następnie ustawiam rozmiar tła na 100%, aby skalować go poprawnie. potem ustawić właściwy obraz do każdego przycisku, stosując te :increment, :decrement, :horizontal i :vertical selektorów. Obrazy są teraz w moim publicznym folderze dropbox, ale możesz dodać własne.

Oto zaktualizowany kod: http://jsfiddle.net/Nk3NH/2/

kod pisałem było to:

::-webkit-scrollbar-button { 
    background-size: 100%; 
    height: 10px; 
    width: 10px; 
    -webkit-box-shadow: inset 1px 1px 2px rgba(0,0,0,0.2); 
} 

::-webkit-scrollbar-button:horizontal:increment { 
    background-image: url(https://dl.dropboxusercontent.com/u/55165267/icon2.png); 
} 

::-webkit-scrollbar-button:horizontal:decrement { 
    background-image: url(https://dl.dropboxusercontent.com/u/55165267/icon4.png); 
} 

::-webkit-scrollbar-button:vertical:increment { 
    background-image: url(https://dl.dropboxusercontent.com/u/55165267/icon3.png); 
} 

::-webkit-scrollbar-button:vertical:decrement { 
    background-image: url(https://dl.dropboxusercontent.com/u/55165267/icon.png); 
} 

EDIT: Udało nam się dostać przyciski przewijania obok siebie jak PO chciała dodając te style:

::-webkit-scrollbar-button:end { 
    display: block; 
} 

::-webkit-scrollbar-button:start { 
    display: none; 
} 

http://jsfiddle.net/Nk3NH/4/

Zaktualizowany kod z base64 obrazów zamiast linki:

http://jsfiddle.net/burkybang/1z7vgfpt/

Answer 2

Wystarczy dodać:

::-webkit-scrollbar-thumb { 
    background-image:url(http://i.imgur.com/ygGobeC.png); 
}