There are many ways to do this. Here's a very, very simple method.
var divs = [div1, div2, div3, ...div6];
var fadeNext = function(index) {
if (!divs[index]) return;
divs[index].tween('opacity', 0,
1).get('tween').chain(fadeNext.pass(index+1));
}
fadeNext(0);
On Fri, Nov 27, 2009 at 5:35 PM, Todd <[email protected]> wrote:
> I have 6 divs ('one', 'two', 'three', 'four' etc.) that need to fade-
> in in order. Div 'one' would begin after a delay of 1800ms and the
> rest would be delayed accordingly: 'two' 2200, 'three' 2600, 'four'
> 3000 and so on. The transition for all divs would be 400.
>
> The only way I know how to do it is by using the code below for each
> of the 6 divs. While this works it's obviously hugely redundant and I
> know there's a much more efficient way of writing it but I'm
> struggling.
>
> Thanks
>
> $(window).addEvent('domready', function(){
> $('one').set('tween', {
> duration: 400
> });
> (function(){
> $('one').tween('opacity', [0, 1]);
> }).delay(1800);
> });
>
