Question

I’m trying to make an image cycler thing for my website with jQuery, but I can’t get it to cycle through.I want to add three buttons that will cycle through the pictures, button1 = first picture, button2= second picture, etc… AND have it cycle through automaticaly every 5 seconds or so if the buttons are not clicked, how would I do this. I’ve searched for a solution, with no luck. Help would be much appreciated.
My code is:

$(document).ready(function() {
var current = 1
if(current == 1){
    $('.imgslide1').fadeOut();
    $('.imgslide2').fadeOut();
    $('.imgslide3').fadeOut();
    $('.imgslide1').fadeIn().delay(3000).fadeOut().curr();
};
if(current == 2){
    $('.imgslide1').fadeOut();
    $('.imgslide2').fadeOut();
    $('.imgslide3').fadeOut();
    $('.imgslide2').fadeIn().delay(3000).fadeOut().curr();
};
if(current == 3){
    $('.imgslide1').fadeOut();
    $('.imgslide2').fadeOut();
    $('.imgslide3').fadeOut();
    $('.imgslide3').fadeIn().delay(3000).fadeOut().curr();
};
if(current > 3){
    current = 1;
};
function curr(){
    current++;
};
$('#button1').click(function() {
    current = 1
});
$('#button2').click(function() {
    current = 2
});
$('#button3').click(function() {
    current = 3
});

});

Answer 1

Is there any particular reason you want a custom one? There are a number of jQuery plugins and libraries available. I have used Easy Slider in the past. It’s very simplistic and isn’t very large, so there’s virtually no impact on performance.