Jump to content
Search Community

spilt text

Mustana test
Moderator Tag

Recommended Posts

Don't cry over spilt text!

 

If you're using static text in Animate, you can  go modify - break apart, then Modify - Timeline - Distribute to layers. With each letter on its own layer, you can do timeline animation, under a motion guide  or whatever you need, with each letter being independent. 

Or, you could turn a string into an array of letters with javascript, then move them around with gsap, if you're more clever than I am right this morning. 

  • Like 3
Link to comment
Share on other sites

  • 4 weeks later...

1. Create new document for example 300 x 250

2. Load SplitText.min.js
3. Write this code in Actions


text1 = document.createElement("txt1");
t1 = document.createTextNode("Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eos eiusmod tempor incididunt ut qui labore et dolore ex magna aliqua. Ut enim ad minim veniam, quis nostrud ullamco laboris nisi ut aliquip ex ea commodo consequat voluptas nulla.");
text1.appendChild(t1);
document.getElementById("dom_overlay_container").appendChild(text1);

text1.style.position = "absolute";
text1.style.top = "25px";
text1.style.left = "25px";
text1.style.width = "250px";
text1.style.height = "200px";
text1.style.font = "18px 'Arial'";
text1.style.color = "Black";

gsap.from(new SplitText("txt1").chars, {duration:0.8, opacity:0, scale:0, y:80, rotationX:180, transformOrigin:"0% 50% -50",  perspective:400, ease:"back.out", stagger: 0.01});

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.
×
×
  • Create New...