Jump to content
GreenSock

Search In
  • More options...
Find results that contain...
Find results in...
Cere6ellum

Animated showing of data from an array

Recommended Posts

Hello dear community.

I have big interesting issue.

 

I need to animate string.

This string will be animated divided on chars.

I know how i'll animate it.

 

But, i cannot understand how i need to show this string.

 

This method doesn't work.

$.each(charsArr, function(i) {
            tl.to($(this).find("#section-1"), 2.5, {
            autoalpha: 1,
            fontSize: "2vw",
            color: "#eeeeee",
            opacity: 100,

Share this post


Link to post
Share on other sites

How I mostly do it is as follows:

 

Split the text using SplitText utility

 

Stagger the character elements

 

Just a quick demo

 

See the Pen jOONQrQ by kishin-karra (@kishin-karra) on CodePen

 

  • Like 3

Share this post


Link to post
Share on other sites
8 minutes ago, Kishin Karra said:

How I mostly do it is as follows:

 

Split the text using SplitText utility

 

Stagger the character elements

 

Just a quick demo

 

 

 

 

 

There is you are showing that your chars have parent's id.

I know and understand this solution.

But, if these chars are in the array (not in DOM), how will it be shown?

 

 

Share this post


Link to post
Share on other sites

Hey @Cere6ellum,

 

You can use the textPlugin if I understand your intention correctly.

 

See the Pen rNNBoOW by mikeK (@mikeK) on CodePen

 

Happy tweening ...

Mikel

  • Like 1

Share this post


Link to post
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

Loading...

  • Recently Browsing   0 members

    No registered users viewing this page.

×