Jump to content
GreenSock

bobdobbs

Uncaught TypeError: Cannot call method 'to' of undefined

Recommended Posts

I've been playing time with tweenmax. I pretty soon realized that I couldn't get the effect that I wanted without using timelinemax.

 

I'm loading tweenmax into my browser. But I cant do anything with it.

 

when I start do anything with tl.to(...) chrome's console give me the error "uncaught exception: cannot call method 'to' of undefined. Console references me to the line where I use 'tl,to().

 

The sample code I'm working with can be seen at hastebin.com/midacafegu.vbs

 

Link to comment
Share on other sites

It looks like you probably haven't created a TimelineMax variable called tl at that point.

 

You'll need to make sure that you've created a timeline like the following before calling tl.to() etc:

var tl = new TimelineMax();
tl.to(...);
Link to comment
Share on other sites

Hi.

 

Sorry, my url to a paste was broken. My code is below.

 

As you can see, I have declared a timeline variable. But I still get the error.

 

The variable 'window.myApp.slides' points to a jQuery dom selector.

var slides =  window.myApp.slides ;
var tl = new TimelineMax(
    tl.to(
        slides,
        2,
        { left :  "0px" }
    )
    
    ) ;
Link to comment
Share on other sites

Hi,

 

The engine is reporting that slides is undefined, meaning that window.myApp.slides returns nothing.

 

The standard JQuery selector uses the Jquery function:

//if the item(s) have a class slides
var slides = $(".slides");

//if the imem have an ID slides
var slides = $("#slides");

Also you have a syntax error, you have to create the timeline and then add the particular tweens, like this:

var tl = new TimelineMax();

tl.to(
    slides,
    2,
    {left:0}
);

Check that the elements being animated have either a relative or absolute position.

 

Also it would be very helpful if you could create a codepen or fiddle in order to see what could be the problem.

 

And last but not least check the following links, they have the essential stuff to get started with the engine:

http://www.greensock.com/get-started-js/

 

http://www.greensock.com/jump-start-js/

 

http://www.greensock.com/sequence-video/

 

Hope this helps,

Rodrigo.

Link to comment
Share on other sites

 Hi. Thanks for the help.

 

I finally got it to work. I split the code into two lines. Instead of declaring and definging the variable 'tl' in one line, I did two experessions:

 

The first line declares, the second line defines.

var tl = new TimelineMax() ;
tl.to( slides, 2, { left : 0} ) ;

When I split my code into two lines the animation worked.

Link to comment
Share on other sites

Turns that Jamie was right about his presumption. Since you putted the call inside the variable creation the timeline wasn't created yet.

 

Glad you got it working.

 

Rodrigo.

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.
×