Jump to content


Getting reference error using TweenLite

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



I'm trying to use GSAP to make animations but I keep getting an error saying that TweeLite is not defined.

I tried typing window.TweenMax in my console and it resulted in "undefined".


Obviously, TweenMax is not loading but I tried loading it from the site, from local harddrive and it keeps failing.


I used

<script src="http://cdnjs.cloudflare.com/ajax/libs/gsap/1.18.4/TweenMax.min.js"></script>


<script src="../js/gsap/TweenMax.js"></script>


Any ideas ?



See the Pen VjbyRX by Weegle (@Weegle) on CodePen

Link to comment
Share on other sites

Hi and welcome to the GreenSock forums.


From looking at your code it appears you are loading test.js BEFORE you load TweenMax. You need to switch the order around. TweenMax has to load before your custom code can reference it.


Thanks for the CodePen demo. 2 things to keep in mind.


You don't need any of the head or body tags in the HTML panel. CodePen adds them for you.

To add scripts use the gear icon at the top of the JS panel. 


I added TweenMax for you here: https://codepen.io/GreenSock/pen/GqmxXW Your TweenLite code is good.



  • Like 3
Link to comment
Share on other sites

  • 1 month later...

Hi im getting the same thing but my code looks fine, 


define(['jquery', 'TweenLite', 'TimelineLite', 'gsapCss', 'gsapJquery'], function ($) {
    'use strict';});
var slide = TweenLite.to(1.25, {x:-150, ease:Power4.easeInOut, onUpdateParams:[".box_2"], paused:true});
$(".box_2").hover(over, out);
function over() {
function out() {
Link to comment
Share on other sites

This topic is now closed to further replies.
  • Recently Browsing   0 members

    • No registered users viewing this page.