Jump to content
Search Community

Null target

Cere6ellum test
Moderator Tag

Warning: Please note

This thread was started before GSAP 3 was released. Some information, especially the syntax, may be out of date for GSAP 3. Please see the GSAP 3 migration guide and release notes for more information about how to update the code to GSAP 3's syntax. 

Recommended Posts

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();

 

Link to comment
Share on other sites

Hi and welcome to the GreenSock forums,

 

It looks like you aren't providing a valid target to this tween:

 

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

 

spin() is a function that creates a bunch of TweenMax tweens. You can't tween a function.

 

I think you probably want your spin() function to return a timeline that you then add() to tl3.

 

Please see this article for a detailed explanation of how that would work: https://css-tricks.com/writing-smarter-animation-code/

 

In the future, please consider providing a reduced test case as explained below. It makes it much easier to offer assistance.

 

 

 

 

 

  • Like 2
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...