jquery content slider sliding
===

this is th html part of the sliders navigation

    <div id="button">
		 <a class="button1 active" rel="1" href="#"></a>
		 <a class="button2" rel="2" href="#"></a>
		 <a class="button3" rel="3" href="#"></a>
	</div>

this is the complete jquery code for the slider

    $(document).ready(function (){
	$('#button a').click(function(){
		var integer = $(this).attr('rel');
		$('#myslide .cover').animate({left:-160*(parseInt(integer)-1)})  /*----- Width of div mystuff (here 160) ------ */
		$('#button a').each(function(){
		$(this).removeClass('active');
			if($(this).hasClass('button'+integer)){
				$(this).addClass('active')}
		});
	});	
});

i am building a content slider for an assignment on college and i am having trouble following this code 

you can find the complete code for this slider here:

http://www.webdeveloperjuice.com/2010/01/12/lightest-jquery-content-slider-ever-made-380-bytes/

our 3 links have rel attributes with values 1,2 and 3
this line of jquery calculates how much will the slider slide

$('#myslide .cover').animate({left:-160*(parseInt(integer)-1)})

so if the variable integer is 1 it will be -160*(1-1)=0 - the slider doesnt move 
if its 2 the result will be -160 and it will move to the right for 160px
and if its 3 it will move to the right for 320px

and the question is 

how does this code moves the slide to the left?
it works if you test the demo on the page, but i dont understand how?
can someone explain it to me please.

thank you

