Redesign progress, and a link

So, I thought I would post a link so anyone interested can see the changes as they happen for my redesign. If you check it out and you see a totally different theme up there, don’t worry, I’m just using it to check something out. I kept working on my jQuery slider last night, by adding a list that can also control the slider’s movement. Was actually quite easy…here is snippet for the list javascript.

$('#controlList li').click(function() {
	currentPosition = ($(this).index());
	$('#slideWrap').animate({'marginLeft' :
        slideWidth*(-currentPosition)});
});

What does this do? GREAT question. The first line is to get all the list items in a div with an id of controlList, and put a click function on them. The second line is to set the current position of the slider equal to the li that was clicked. So if you click the third list item, currentPosition is = to 2. Why 2 you ask? Because the index of something starts at 0, which is good, because here, currentPosition is set to 0 at the start also.

The third and fourth line move the slider the width of an individual slide times the negative position. Why negative? Because we are always adjust the left margin of the slider, and it starts at 0. To get to slide 2, the margin left is going to be -1 x the slide width, to get to slide 3 it will be -2 x the slide width, and so on.

Leave a Reply