captainJak

Sorry about the extra code. Assumed might as well keep it in case something is conflicting that I wasn't aware of. That did it and makes perfect sense. Thanks for the help!

Yep: http://codepen.io/captianJak/pen/GieCp Thanks!!

Thanks for the help by the way.

That didn't do it (see attached gif for example). TweenMax.staggerTo($("#overlayFrame"+nextFrame+ " .hotSpot"),2,{opacity:1,immediateRender:true}, 2);

The two tweens below fade in a group of divs, but the problem is each fades in with more time between the last as it progresses (almost like it's exponentially slowing). And both tweens below fade in the first two divs at the exact same time with no stagger (hence "faking" it with the delay on the second). Any idea why? How can I get a group of divs with the same class to fade in, one by one, with the same uniform delay between the first two and the rest? Thanks in advance! /* this one doesn't work in a linear fashion */ TweenMax.staggerFromTo($("#overlayFrame"+nextFrame+ " .hotSpot"), 1.5,{opacity:0},{opacity:1},2); /* this one doesn't work in a linear fashion */ var tl = new TimelineMax() tl.add(TweenLite.to($(".courthouse"), 1, {opacity:1})); tl.add(TweenLite.to($(".hospital"), 1, {opacity:1,delay:1})); tl.add(TweenLite.to($(".jail"), 1, {opacity:1})); tl.add(TweenLite.to($(".park"), 1, {opacity:1})); tl.add(TweenLite.to($(".cafe"), 1, {opacity:1}));