Jump to content
GreenSock

jiggy1965

Animated Text in Adobe Animate fails to work

Recommended Posts

I've been following your quick Twitter video on animating text, @Carl

But for some reason my file doesn't seem to work. I added the GSAP Library, added the broken down text field to create an array of letters and added below code.

 

let letters= this.my_text.children;
console.log (letters);
let tl = gsap.timeline({repeat:9})
tl.from(letters, {y:100, alpha:0, stagger:0.1, scaleX:0.2, ease:"back"});
tl.to(letters, {y:-50, alpha:0, duration:0.25, stagger:-0.05}, ">0.5");

 

But I then get the browser console error:

GSAP target  not found. https://greensock.com
Tween — gsap.min.js:10:32341

 

When I use let letters= this.my_text, without 'children' it works. The entire clip animates. But when I add 'children', the text and letters just freeze and I get this message that the GSAP target can't be found. Both in Safari and Chrome.

 

What am I doing wrong? Attached the Adobe Animate file

 

animatedtext.fla

Link to comment
Share on other sites

Never mind, figured out that I had to add that script 1 frame later than the actual text movie clip on frame 1

  • Like 2
Link to comment
Share on other sites

I just downloaded your file and it worked perfectly for me. thanks for providing it.

I'm guessing you may have an older version of Animate. There was a problem where scripts on frame 1 could not access movieclip children. You had to wait a frame or wait for some frame_rendered event or something dumb.

 

In Animate 20 it works fine. It was one of my biggest issues with Animate.

  • Like 3
Link to comment
Share on other sites

That was indeed it (I'm using the 2019 version of Animate). Got it working now. But I am curious though... The stagger runs nicely through all letters from left to right. That's probably the order (left > right) that they are placed once the textfield is broken down to letters. When I would move the letters in that clip around it would still stagger in that same order. Even if I would move letter two to the left of letter one.

 

Was wondering what to do when I would like to have the same result when using a movie clip filled with various shapes instead of letters. And how to set the order in which those shapes should stagger. I would probably have to create some individual movie clips inside the container movie clip and then create an array variable in which to set each array index to a specific shape movie clip? Something like clips[1] = this.clip1 ? And then using the same way (using .children) to tween all individual children of that container clip in the order in which they are used in that array variable?

Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
  • Recently Browsing   0 members

    • No registered users viewing this page.
×