Carl last won the day on November 7

Carl had the most liked content!


  • Content count

  • Joined

  • Last visited

  • Days Won


Carl last won the day on November 7

Carl had the most liked content!

Community Reputation

6,721 Superhero


About Carl

  • Rank

Profile Information

  • Gender
    Not Telling
  1. Literally first GSOP animation not working

    Hi and welcome to the GreenSock forums. Thanks for the demo. In order to change the top, left, right, or bottom values you need to give the element a css position property first. This is necessary even without GSAP. If you add to your css: .logo { top:200px; } You will notice that the top value doesn't change. But if you add position:relative it works. .logo { position:relative; top:200px; } here is a fork of your demo with the fix
  2. Multiple TimelineMax onComplete function help

    I think this old pen may be of help. press the buttons whenever you want. The current animation will reverse before the requested animation plays. Its set to run super slow so you can see how it works
  3. controlling video with page scroll

    Sorry, I haven't had much experience with controlling video via scroll. It isn't a feature of GSAP.
  4. Not really sure what to suggest here. Either there are some advanced css techniques that you will need or you'll need to animate things below down based on the height of the div when it is full width. Not really something GSAP will do for you naturally. Perhaps other people will have some ideas but its a bit beyond our typical product support. Sorry I don't have a better solution for you.
  5. Using timeline to orchestrate non-GSAP operations

    Hey Sahil, What you are doing is totally fine. Here is an alternate approach using addPause()
  6. Correct Syntax to remove multiple classes

    You can remove multiple class names with 2 separate tweens:".green", 2, {className:"-=open"})".green", 2, {className:"-=white", overwrite:"none"}) This is the first time we've heard of this so we will have to weigh the pros and cons of supporting multiple classes in one line. Thanks for bringing it to our attention.
  7. Can't use GSAP in a function? (Animate CC)

    Hi and welcome to the GreenSock forums, Yeah, moving from AS3 to EaselJS has some super frustrating stumbling blocks. 2 options. 1: Create a global reference to the stage (aka root) like var root = this; function playAnimation() {, 3, {x:500}); } playAnimation(); 2: pass the scope into the function function playAnimation(scope) {, 3, {x:500}); } playAnimation(this); I prefer option 1.
  8. Can we create a basic retro game using GSAP?

    Hi warren, nice to see you again. Yes, GSAP can handle animation in a game, but there is a lot more to making a game than just making things move. For character movement TweenLite may not be the best choice as a tween has fixed duration and destination. For instance if pressing the right arrow key creates a tween that moves something 100px to the right of its current location for 1 second, what if the user wants to move 300px? will the user need to press 3 times or will you have to program some awkward logic that repeatedly checks if a new motion tween should be created once the first tween ends. What if while the character is moving to the right the user hits the down arrow? Will you need to write code that kills the tween that is moving to the right? Character movement is usually handled by making small increments to x/y values while a particular key is down. If you want to move enemy ships around or fire bullets, tweens would be great. My suggestion is to start small with very very low expectations. Get something small working and then try to figure out how to add more features. 95% of building your game will be writing code un-related to animation: collision detection, scoring, generating enemies, generating missiles, programming input controls, etc. I would suggest going to some sites that focus on general HTML5 Game Development and learn the basics without using GSAP at all. Add GSAP only where it makes sense or makes things easier.
  9. TweenMax.defaultOverwrite doesn't work

    You're right. Although we have the docs configured to not show that property in the left nav it is still showing up on the TweenMax main class page at the bottom. We are looking into getting that fixed. Sorry for the confusion.
  10. TweenMax.defaultOverwrite doesn't work

    Hi, Sorry for the confusion, but there's no such thing as TweenMax.defaultEase. As Jack mentioned in a recent post about TweenLite.defaultEase... TweenLite is the core class for everything, thus it's the proper place to attach static properties like that. It'd be inefficient to have to check two places for a default overwrite mode and it would cause more confusion if they were different. Hopefully that helps
  11. Open a link after tweening

    You could use an onComplete callback like".green", 2, {x:300, onComplete:doSomething}) function doSomething(){ window.location.assign("") }
  12. Open a link after tweening

    I'm guessing you didn't mean to post this in our archived Flash forums. I'll move it to HTML5 / JS
  13. Hi and welcome to the GreenSock forums, That CodePen demo was related to this post: As you can probably tell from the source code it isn't really a "beginner-friendly" type of project If you have a specific question, I'd suggest asking @OSUblake in that thread.
  14. Draggable disables Chart.js animation?

    Hi and welcome to the GreenSock forums, Sorry to hear you are having problems. I'm not familiar with Chart.js or why Draggable would cause a conflict. Please provide a very simple reduced test case so we can take a peek. Below is a basic CodePen demo using Draggable
  15. Yeah, providing a CodePen demo is best. This way we can see your actual code and don't have to build something from scratch guessing how you did it. I'm not exactly sure what the problem is, so seeing it is best. Go ahead and fork this pen: As you can see it already splits and reverts text with nested spans