Custom Jquery slideshow doesn't want to reset?

Posted by Jared on Stack Overflow See other posts from Stack Overflow or by Jared
Published on 2010-04-13T15:38:27Z Indexed on 2010/04/13 15:52 UTC
Read the original article Hit count: 315

Filed under:
|

Hello,

Under $(document).ready(function(), I have the following code:

num = $("#mainContentCategoryLinksWrapper > div").size();

This makes num equal the length of the children of #mainContentCategoryLinksWrapper. Currently, this equals 4. Above the $(document).ready(function( I have this:

var timesRun = 0;

    function slideshow(){


        if(timesRun < num){
                     $(".arrowIn").stop().animate({color: "#a12324", textIndent: "30px", backgroundPosition: '0px 0px'}, 100, function(){ //the first child in the series has a class of "arrowIn"

                                                                        $(".arrowIn").next().addClass("replaceMe"); //Adds the ".replaceMe" placeholder the the next element.
                                                                          $(".arrowIn").removeClass("arrowIn"); //Deletes the class on the current element
                                                                          $(".replaceMe").addClass("arrowIn").removeClass("replaceMe"); //reassigns ".arrowIn" over ".replaceMe"    
                                                                          timesRun = timesRun + 1; //increases number of times run

                                                                                                                                        }).prev().animate({color: "#000000", textIndent: "25px", backgroundPosition: '0px -25px'}, {duration: 50}); //puts the previous element back to it's original position

                        }else{

                            timesRun = 0;
                            $(".arrowIn").removeClass("arrowIn");
                            $("#mainContentCategoryLinksWrapper:first-child").addClass("arrowIn"); //this is supposed to reset timesRun, and set the first child in the series back to the original ".arrowIn" 
                }




    }

setInterval( 'slideshow()', 1000 );

So here is the what the code does:

1) Animates the first in the series of 4 (#1) timesRun = 1 2) Animates the second in the series of 4 (#2) timesRun = 2 3) Animates the third in the series of 4 (#3) timesRun = 3 4) Animates the fourth in the series of 4 (#4) timesRun = 4 5) timesRun is now longer less than num. Reset class names back to original to .arrowIn, set timesRun to 0.

However, when the slideshow() is reexectuted, it doesn't start over.

Any ideas? See www.raceramps.com/v3 for an example.

© Stack Overflow or respective owner

Related posts about jQuery

Related posts about JavaScript