Question

I am trying to do a slider, with 5 content slides, each slide in a div to personalize each slide.

I normally have no problem coding this in jquery, but my problem now is that instead of a prev-next kind of navigation, I need each slide to have links that directs to the rest of the slider. so show slide one on load page, and that slide has links inside for slide 2,3,4 and 5, and so on

can anyone help me with this?

thank you!!

Answer 1

Without seeing your HTML / images /css there’s only so much I can suggest, but my first solution would be something like this: (Partially pseudo code, as it seems you understand jQuery and just need the logic, but just say if you want it written out fuller :))

$('a.linkToOtherSlides').click(function(){
    slideNumber = $(this).val();
    imageWidth = $(this).parents(.theSliderImage);
    $(this).parents('.theSliderContainer').css('left',slideNumber * imageWidth);
});

So what’s happening here is the value of the link (You should give this to the slide numbers, I’e link to slide 4, has a val of 4) And then it simply will change the left value of the slider container as you normally would, via multiplying the slideNumber by imageWidth.

Just a first idea, hopefully we can come to a better conclusion with work.