Jump to content
GreenSock

Search In
  • More options...
Find results that contain...
Find results in...

Search the Community

Showing results for tags 'head'.

  • Search By Tags

    Type tags separated by commas.
  • Search By Author

Content Type


Forums

  • GreenSock Forums
    • GSAP
    • Banner Animation
    • Jobs & Freelance
  • Flash / ActionScript Archive
    • GSAP (Flash)
    • Loading (Flash)
    • TransformManager (Flash)

Product Groups

  • Club GreenSock
  • TransformManager
  • Supercharge

Categories

There are no results to display.


Find results in...

Find results that contain...


Date Created

  • Start

    End


Last Updated

  • Start

    End


Filter by number of...

Joined

  • Start

    End


Group


Personal Website


Twitter


CodePen


Company Website


Location


Interests

Found 1 result

  1. If I load the timeline code in the <head> and put play() in the <body>. The code "runs" but doesn't "display" animation on screen. By "display" I mean: no animation happens on the browser screen. By "runs" I mean: if I put a breakpoint on the .play() line in the <body>, I can step into the TweenMax code in the <head> and watch variable like "e", and "this._duration" assume the correct values as I step deeper into the code. I'm used to splitting things this way on the jQuery animate code I've been writing and must do so for compatibility. So why can't timelines be defined in the <head>? I'm assuming there must be a little "trick" I'm missing to make it work. Please see <body> only and split code below (and attached). With all code in the <body> this works no problem: <html> <head> <script src="http://cdnjs.cloudflare.com/ajax/libs/gsap/latest/TweenMax.min.js"></script> </head> <body> <div id="title">This is growing title</div> <script type="text/javascript"> var timeline = new TimelineMax({paused:true}); timeline.to("#title", 2, {color:"#F0F", fontSize:"48px"}); timeline.play(); console.log("yes it ran"); </script> </body> </html> With the timeline in the <head> and play() in the <body> this doesn't do anything on screen but the console.log()string shows in the console, you can step into the timeline code and there is no error break: <html> <head> <script src="http://cdnjs.cloudflare.com/ajax/libs/gsap/latest/TweenMax.min.js"></script> <script type="text/javascript"> var timeline = new TimelineMax({paused:true}); timeline.to("#title", 2, {color:"#0FF", fontSize:"48px"}); </script> </head> <body> <div id="title">This is growing title</div> <script type="text/javascript"> timeline.play(); console.log("yes it ran"); </script> </body> </html> [sorry I attached both twice, only download the first two!] simplest_timeline.html simplest_timeline_head.html simplest_timeline.html simplest_timeline_head.html
×