views:

128

answers:

2

I am trying to alternate between two logos every 5 seconds using the following code:

window.setInterval(
    function () {
        //breakpoint 1
        $("#logo").toggle(
            function() {
                //breakpoint 2
                $(this).attr('src', '/Images/logo1.png');
            },
            function() {
                //breakpoint 3
                $(this).attr('src', '/Images/logo2.png');
            }
        );
    },
    5000
);

I can get a simple toggle to work, but when I introduce the toggle within window.setInterval(), the toggle's two handlers won't fire.

I set breakpoints on the lines directly beneath the comments in the code above. Breakpoint 1 hits every 5 seconds. However, Breakpoint 2 and 3 never hit.

Why are neither of the toggle function's handlers firing?

+5  A: 

toggle() needs to be clicked as far as I know....

So,

   $("#logo").toggle(
        function() {
            //breakpoint 2
            $(this).attr('src', '/Images/logo1.png');
        },
        function() {
            //breakpoint 3
            $(this).attr('src', '/Images/logo2.png');
        }
    );

window.setInterval(
    function () {        
        $("#logo").trigger('click');
    },
    5000
);
Reigel
Thanks Reigel; This worked for me.
Paul Daly
A: 

Sounds like jQuery doesn't finds the #logo element.

How does the HTML markup look like?

You can try this to see if jQuery finds the #logo element:

//Firebug way
console.log($('#logo').length)

//alert way
alert($('#logo').length)

..fredrik

fredrik