It can be done with setInterval too but doing it recursively with
setTimeout is a bit better:
var i=0, elements=$('.box'), length=elements.length;
function fade(delay){
elements.eq(i++).fadeOut();
if(i<=length)
setTimeout(arguments.callee, delay);
//arguments.callee is a reference to the current function
}
fade(500);
On Jan 10, 3:05 am, legofish <pen...@gmail.com> wrote:
> Hi,
>
> I have 20 divs all with the class ".box" on my page.
> I want to apply the fadeIn() effect to all of them.
> I dont want them to all fade in at the same time.
> I want them to fade-in one by one, with a slight time offset.
> I dont want to use callback functions, because I dont want to wait
> until the fade is completely finished on one div before fading the
> next div. I want the fade effect on the next div to start a short time
> after the effect on the previous one has started.
>
> So I think I need to use setTimeout and some kind of a recursive
> method, but I'm not very good with JS so I was hoping someone would
> find this trivial and could help answer my question.
>
> my thanks in advance.
