[Animated showing of data from an array]

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?

 

 

[Animated showing of data from an array]

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,

[Null target]

Good day dear community.

Can't resolve a problem.

I wanna add tween to timeLine animation. It works. 

It will be an animation cosist of multiple sub-animations, that will be performed in parallel.

But.

Chrome shows me the error:

Quote

Uncaught Cannot tween a null target.

 

I can't understand what's happened.

Please advice me.

What am i doing wrong?

 

<div class="section-3">
	<span id="dots">
		<span></span>
		<span></span>
		<span></span>
	</span>
</div>					
			

var b3Text = $("#dots");

    var tl3 = new TimelineMax({paused: true});

    function spin(elem) {
        $(elem.find("span")).each(function(i) {
            TweenMax.to($(this), 2.5, {
                x: randomWithBounds(0, $(this).parent().parent().width() - 10),
                y: randomWithBounds(0, $(this).parent().parent().height() - 10),
                delay: i + 2,
		rotationX: 360,
		ease: Power1.easeInOut,
		onComplete: function() {
                    spin(elem);
                }
            }, 0.1);
        })
    }

    tl3.to(spin(b3Text), 1, 
	{
		repeat: -1,
		repeatDelay: 0.5
	});

tl3.play();