Question

So what I have is a big image that I’m trying to animate continuously while someone is on the page

What I do now is:

$('.photobanner').animate({ 
    backgroundPosition:"(-10000px 0px)" 
}, 80000, 'linear');

and this works .. but it seems it comes to an end and stops .. can I do the same animation infinitely ??

NOW IT WORKS —-

var counter=0;
function moveBG(y)
{
    counter=counter-1000;
    $('.photobanner').animate({ backgroundPosition:"("+counter+"px 0px)" }, 8000, 'linear',moveBG);
}

I defined a counter which will be incremented to infinity and used the this function.

Answer 1

You could always do something like this:

function moveBG()
{
    $('.photobanner').css({ backgroundPosition:"(0px 0px)"});
    $('.photobanner').animate({ backgroundPosition:"(-1000px 0px)" }, 8000, 'linear',moveBG);
}

So that the callback of the function redoes the function. It would have to be a seemless image though.