JQuery slide pagination issue

Question

I am jQuery newb and I am trying to create my own slideshow widget for the page I am developing. I was able to get all the main bits (auto play, pause, titles), but I ended up in a checkpoint paginated (allows you to select a slide). For some reason, when I try to select a slide, the image and captions disappear. Errors do not occur, he simply refuses to switch the image or signature. Heres' code:

This bit of code launches and controls the slide show.

$(document).ready(function () {
    var speed = 2000;                            
    var state = 1;                                          

       $('#gallery li, #caption li').css('position','absolute');         

       $('#gallery li:first, #caption li:first').addClass('visible');             

       var timer = setInterval('autoSlideshow(-1)', speed);             

    $('#controls a.playpause').toggle(
        function () {
            $(this).css('background-image','url(images/play.png)');  
            clearInterval(timer);
            state = 0;
            return false;  
        },
        function() {        
            $(this).css('background-image','url(images/pause.png)');
            timer = setInterval('autoSlideshow(-1)', speed);
            state = 1;
            return false; 
        }
    );           

    $('#controls a.pagination').click( function(){
        var slide = $(this).index();

        slide-=1;
        clearInterval(timer);   
        timer = setInterval(function(){autoSlideshow(slide);}, speed);


    });


    $('#gallery, #caption').hover(                               
        function() {
            if(state == 1)  
                clearInterval(timer); 
        },   
        function() {
            if (state == 1)  
                timer = setInterval('autoSlideshow(-1)', speed); 
        }  
    );


});

This bit fades in and out of the slides.

    function autoSlideshow(mode) {
    var currentImage = $('#gallery li.visible');                                   
    var currentCaption = $('#caption li.visible');

    if(mode == -1){
        var nextImage = currentImage.next().length ? currentImage.next() :        
                    currentImage.siblings(':first');        
        var nextCaption = currentCaption.next().length ? currentCaption.next() :          //Determine the next slide
                    currentCaption.siblings(':first');
    }
    else{
        var nextImage = $('#gallery li:eq(mode)');   //I'm pretty sure these two lines are the problem
        var nextCaption = $('#caption li:eq(mode)'); //
    }  

    currentImage.fadeOut(250).removeClass('visible');
    nextImage.fadeIn(250).addClass('visible');  
    currentCaption.fadeOut(250).removeClass('visible');
    nextCaption.fadeIn(250).addClass('visible');


}

Any help you could give would be appreciated.

Mo

Answer 1

string constant vs variable.... :

    var nextImage = $('#gallery li:eq('+mode+')'); 
    var nextCaption = $('#caption li:eq('+mode+')');

, eq "mode".

(NB: , , .)

. , "--" - . . .

- jQuery. ,

'#caption li:eq(' ( ), , ')' jQuery.

, jQuery ( 9):

'#caption li:eq(9)'

jQuery

'#caption li:eq(mode)'

?