Jump to content
Search Community


xxboonexx 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

Help, I am going through the gotoAndlearn tutorial on html 5 animation with tween max here http://www.gotoandle...play.php?id=161


But when I get to the timeLineMax segment my animation stops working. the code entered looks like this:

<script src="js/TweenMax.min.js"></script>
var tl = new TimeLineMax();

tl.from(b, 1.5, {css:{left:400, rotation:180}, ease:Back.easeOut});


This doesn't work at all any ideas?




Link to comment
Share on other sites

It seems as soon as I declare the variable, the whole thing stops working.


so this code works Note that I am not using the timelineMax to animate:


<!doctype html>
<html lang="en">


<title>HTML5 Example</title>

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


function init() {
var b = document.getElementById("box");
b.style.left = (window.innerWidth * 0.5 - 100) + "px";
b.style.top = (window.innerHeight * 0.5 - 100) + "px";

//var tl = new TimeLineMax();

TweenMax.to(b, 1.5, {css:{left:200}, ease:Expo.easeOut});
TweenMax.to(b, 1.5, {css:{scale:3}, ease:Expo.easeOut});


<style type="text/css">

#box {
width: 200px;
height: 200px;
background-color: #f9276c;
position: absolute;



<body onLoad="init()">

<div id="box"></div>





but as soon as I uncomment the var line it stops working.


Thanks in advance.



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