Jump to content
GreenSock

Mr Pablo

Unable to use OO syntax?

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

When trying to use OO syntax, I get the following error:

 

Uncaught TypeError: Object [object Object] has no method 'fromTo'

 

Here is my code:

var tween = new TweenMax.set(text, { css: {color: "#ffff00", display: "block", fontFamily: "Folksolid", fontSize: "40px", height: "52px", margin: "0", padding: "0", position: "absolute", width: "140px", zIndex: "3"} });
                tween.fromTo(text,
                                0.5,
                                {opacity: 0, rotation: -20, scaleX: 0.5, scaleY: 0.5, x: 100, y: 100},
                                {ease: Bounce.easeOut, delay: 2, opacity: 1, scaleX: 3, scaleY: 3, x: 160, y: 160}
                            );
Link to comment
Share on other sites

Hi,

 

I think fromTo() is static method and cannot be used with instance of TweenMax. That's why the browser throws this error. 

  • Like 3
Link to comment
Share on other sites

bassta has it right: fromTo, along with the other 'create a tween' methods and a few others, are static and should be called on TweenLite/TweenMax directly. The static methods are marked as such in the documentation. You could try:

var tween = TweenMax.set(text, { css: {color: "#ffff00", display: "block", fontFamily: "Folksolid", fontSize: "40px", height: "52px", margin: "0", padding: "0", position: "absolute", width: "140px", zIndex: "3"} })

tween = TweenMax.fromTo(text, 0.5,
  {opacity: 0, rotation: -20, scaleX: 0.5, scaleY: 0.5, x: 100, y: 100},
  {ease: Bounce.easeOut, delay: 2, opacity: 1, scaleX: 3, scaleY: 3, x: 160, y: 160}
);

(also I'm somewhat suspicious of new TweenMax.set() as a way to construct an 'object' as well - this javascript prototype stuff causes too many headaches)

 

TweenMax can be instantiated in an 'object-oriented way', using

new TweenMax(target, duration, vars) // i.e. a TweenMax.to tween
  • Like 4
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.
×