What's wrong with this jQuery fading gallery code?

Posted by Meep3D on Stack Overflow See other posts from Stack Overflow or by Meep3D
Published on 2010-03-17T10:46:03Z Indexed on 2010/03/17 10:51 UTC
Read the original article Hit count: 293

Filed under:
|
|

So I am creating a fading gallery and am a bit of a noob to javascript (but not to programming). I have no idea what is wrong though. Here's the function in question:

    /*

    */
    function show_next ()
    {
        // Hide current
        $('.s_gallery_images li.s_current').fadeTo(200, .2);

        $('.s_gallery_images li.s_current').css("border","1px green solid");


        //
        if ($('.s_gallery_images li').hasClass ('.s_current'))
        {
            console.log ('Incrementing existing');

            // Class already exists 
            $('.s_current:first').removeClass('s_current').next().addClass('s_current');

            // Was that the last one?
            if ($('.s_gallery_images li').hasClass ('.s_current'))
            {
                console.log ('Current found');
            }
            else
            {
                // Class doesn't exist - add to first
                $('.s_gallery_images li:first').addClass ('.s_current');

                console.log ('Wrapping');
            }
        }
        else
        {
            console.log ('Adding new class');
            // Class doesn't exist - add to first
            $('.s_gallery_images li:first').addClass ('.s_current');
        }

        // Show new marked item
        $('.s_gallery_images li.s_current').fadeTo(200, .8);
    }

The HTML is a very simple:

<ul class="s_gallery_images">
    <li><img src="imagename" alt="alt" /></li>
    <li><img src="imagename" alt="alt" /></li>
    <li><img src="imagename" alt="alt" /></li>
</ul>

And it displays the list and the images fine. I am using firebugs console.log for debugging, plus have a class set for s_current (bright border) but nothing happens at all.

The firebug console log says:

Adding New Class
Incrementing Existing
Current Found
Incrementing Existing
Current Found
Incrementing Existing
Current Found
Incrementing Existing
Current Found
... to infinity

The function is called on a setInterval timer, and as far as I can tell it should be working (and I have done something similar before), but it just isn't happening :(

© Stack Overflow or respective owner

Related posts about html

Related posts about jQuery