Question

I’m using this jQuery plugin here: http://css-tricks.com/examples/MovingBoxes/

Has anyone used it or can you take a look at the jQuery code, how can i set the function to run periodically rather than on click events?

Thanks

Answer 1

use the setTimeout function that’s part of Javascript (http://www.elated.com/articles/javascript-timers-with-settimeout-and-setinterval/)

You can use setInterval instead, but for most animations setTimeout is easier to control (and more importantly… stop).

Alternatively, the jquery timer plugin http://plugins.jquery.com/project/timers can help, perhaps.

** Edit: Sorry, your question’s tone made me think you were asking about how to do timers, I didn’t realize exactly what you were looking for.

If you search for the event handlers, you’ll see that he sets the buttons get setup to call the goForward and goBackward functions as follows

// Set up click on left/right arrows
base.$el.find('.right').click(function(){
    base.goForward();
    return false;
}).end().find('.left').click(function(){
    base.goBack();
    return false;
});

Those functions start the right and left scrolling by calling the method change which scrolls the location to the specified panel #. You can do the same thing in your timer callback.