Горизонтальный скролл на JS

[funest]

Привет.
Хочу сделать сайт визитку с горизонтальным скроллом, но у же так запутался c js.
Помогите сделать простую анимацию или направьте в нужном направлении:

            <ul id="top_navigation" class="menu right">
                <li><a id="link1" href="#page1" class="active">ГЛАВНАЯ</a></li>
                <li><a id="link2" href="#page2">ГЛАВНАЯ</a></li>
                <li><a id="link3" href="#page3">ГЛАВНАЯ</a></li>
                <li><a id="link4" href="#page4">ГЛАВНАЯ</a></li>
                <li><a id="link5" href="#page5">ГЛАВНАЯ</a></li>
                <div class="cl"></div>
            </ul>
        <div id="carousel">   
	   <ul class="blocks">
		<li class="scroll-interval" id="page1">Тема1</li>
                <li class="scroll-interval" id="page2">Тема2</li>
                <li class="scroll-interval" id="page3">Тема3</li>
                <li class="scroll-interval" id="page4">Тема4</li>
                <li class="scroll-interval" id="page5">Тема5</li>
            </ul>
        </div>

$(document).ready(function(){
	$("#top_navigation li a").click(function(){
		$("#top_navigation li .active").removeClass("active");
		$(this).addClass("active");
		var currentId = $(this).attr('id');
		if(currentId =='link1'){
			$(".blocks").animate({
								 left: '+=999'
								 }, 500);
			$(".blocks").css('left', '0');
		} 
		if(currentId =='link2'){
			$(".blocks").animate({
								 left: '-=999'
								 }, 500);
			$(".blocks").css('left', '999');
		} 
		});
	});

Идея такова, нажимаю на ссылку, плавно смещается <ul class="blocks"> при помощи смены значения свойства left. То что я на куролесил работает через попу, нажимаю на вторую кнопку - проскакивает второй li и появляется третий, последующие проезжают как надо, первая кнопка тоже работает. Так же не понятно, как сделать, чтобы и остальные кнопки срабатывали.