Your second example was closer, considering you triggered the text change in
a callback, but you still triggered the animations all at once which I think
wasn't the effect you desired.
So how does the example I've given you work ? Let's comment :
var recursive_anim = function(list, step, target, duration) {
// this is a recursive function that uses :
// - list which is a list of texts to set in the target between each
animation
// - step the position in the list of the text to set in the target before
this cycle of animation starts (0 => first text, 1 => second text, ...)
// - target the element to animate
// - duration the duration of the fadeIn() and the fadeOut()
if (list[step]) { // when we're through the list, we stop
target.text(text).fadeIn(duration, function() { // we change the target's
text and we start the fadeIn()
$(this).fadeOut(duration, function() { // the callback is triggered once the
fadeIn() finishes, and we're using our target (the element that juste faded
in) to start the fadeOut()
recursive_anim(list, step + 1, $(this), duration) // the fadeOut callback is
triggered once the fadeOut() also finishes, and we're trying the next step
of animation (taking the next text and doing everything over with this text)
});
});
}
};
I corrected a small but significant typo on the line
target.text(text).fadeIn(...), obviously I had forgotten the .text() method
in my earlier example.
Hope it helps.
Michel Belleville
2009/11/9 gthorne <gtho...@gmail.com>
> Is that close to what I was doing on the second example, where I was
> calling $().text in the callback portion of fadeIn()?
>
> On Nov 9, 12:38 am, Michel Belleville <michel.bellevi...@gmail.com>
> wrote:
> > To use callbacks that are triggered actually when the animation finishes
> > instead of calling the animations all at once and seeing only the very
> last
> > because they all start approximately at the same time.
> >
> > Michel Belleville
> >
> > 2009/11/9 gthorne <gtho...@gmail.com>
> >
> > > I'm not sure I follow what the principle is?
> >
> > > On Nov 8, 1:16 pm, Michel Belleville <michel.bellevi...@gmail.com>
> > > wrote:
> > > > Typo indeed ^^°
> >
> > > > Though the principle is sound.
> >
> > > > Michel Belleville
> >
> > > > 2009/11/8 Sam Doyle <sammeh....@gmail.com>
> >
> > > > > $(this).fadeOu(duration, function() {
> >
> > > > > Typo
> >
> > > > > Sent from my iPhone
> >
> > > > > On 8 Nov 2009, at 07:27, Michel Belleville <
> > > michel.bellevi...@gmail.com>
> > > > > wrote:
> >
> > > > > $(this).fadeOu(duration, function() {
>
