Question

I have this code, but it execute only once…

$('.' + container).hover(function() {   
        t = setTimeout( function(elem){
            //this should be executed as long as I hover, 
            //with interval declared in viewSpped variable
            $(elem).find('img').first().appendTo('.' + container).fadeOut(500);
            $(elem).find('img').first().fadeIn(800);    

        }(this), viewSpeed);


    }...

Any idea what I’m doing wrong? thanks!

Answer 1

setTimeout only call the callback once, that’s normal.

Maybe you want setInterval if you want your function to be executed at regular intervals.

And, incidently, there is another error in your code : You probably want

t = setInterval( function(elem){
        //this should be executed as long as I hover, 
        //with interval declared in viewSpped variable
        $(elem).find('img').first().appendTo('.' + container).fadeOut(500);
        $(elem).find('img').first().fadeIn(800);    
    }, viewSpeed, this);

The arguments passed by setInterval or setTimeout to the callback are after the duration.

Or, to be more compatible (note that the link I provide also gives the workaround for IE) :

var $elem = $(this);
t = setInterval( function(){
         $elem.find('img').first().appendTo('.' + container).fadeOut(500);
         $elem.find('img').first().fadeIn(800);    
}, viewSpeed);