[HTML][CSS] Przesuwanie scrollbar-a o zdefiniowaną wartość Opcje

[sumol]

Witam

W witrynie posiadam menu oraz rozciągnięte pole z poziomym scrollbarem

[HTML] pobierz, plaintext 
<div class="menuPositions">
   <a href="#">cat1</a>
   <a href="#">cat2</a>
   <a href="#">cat3</a>
 </div>
<div id="main">
</div>
 
#main {
    position:absolute;
    height:100%;
    width: 100%;
    overflow-x: scroll;
    overflow-y: hidden;
}
[HTML] pobierz, plaintext 

Chciałbym aby klikając w poszczególne kategorie menu scrollbar
przesuwał się o zdefinowaną wartość od lewej strony np 500px
będą to różne niepowtarzaące się wartości dla każdej pozycji menu.
Jak można coś takiego zrobić?