GreenSock last won the day on May 15

GreenSock had the most liked content!

GreenSock

Administrators
  • Content count

    11,898
  • Joined

  • Last visited

  • Days Won

    337

GreenSock last won the day on May 15

GreenSock had the most liked content!

Community Reputation

5,785 Superhero

About GreenSock

  • Rank
    Administrator

Contact Methods

Profile Information

  • Gender
    Male
  • Location
    Chicago Area
  • Interests
    Volleyball, Basketball, Christian Apologetics, Motorcycling

Recent Profile Visitors

45,121 profile views
  1. Loading GSAP through JS then creating a timeline

    Yep, that's the basic idea. It's just a long string as far as the browser is concerned. It has no idea that you want it to execute it as JavaScript until you properly inject it into the DOM.
  2. Draggable Crashing Ionic 2 / Cordova

    FYI, this should be resolved in 1.20.5 which was just released. Enjoy!
  3. Throwpropsplugin not working (npm/webpack issues....)

    We just released 1.20.5, so please try updating to that and let us know if that makes things easier for you. If you get it via NPM, it's ES modules by default. And of course when you download the bonus zip, the files are structured similarly. Enjoy!
  4. GSAP is undefined if a dependency uses GSAP too.

    ....and it's launched Enjoy!
  5. Rotating and translating svg along arc

    We just released 1.20.5, so please try updating to that and let us know if that resolves things. If you get it via NPM, it's ES modules by default.
  6. Loading GSAP through JS then creating a timeline

    I don't have time to look into the specifics, but I believe the problem is that you're not actually doing anything with the TweenMax file that was fetched. In other words, you've gotta put it into a <script> element and dynamically push it into the browser so that it understands it as a JavaScript resource. See what I mean?
  7. Regarding #2, yeah, sorry, that's not something we offer but I'm sure you could rig something up like that yourself. Regarding #1, it is NOT working the way you assumed; it's scrolling the container. It's not moving the box back into view. In other words, to center it I'm animating the scrollTop/scrollLeft of the container rather than the x/y of the box. That's what you wanted, right?
  8. Transition for rotation on click event

    I must be too sleep-deprived because I read the question about 5 times and looked at the codepen and I still don't understand what's being asked. You seem to be using a set() call but expecting an eased animation. Why? And why did you add CSS transitions to something that's being controlled with JS? I'd strongly recommend avoiding that. Wouldn't it be as simple as changing your set() to a to() call and adding a duration? Again, I'm sure I'm missing something obvious. Are you saying that you want Draggable to fire a different event before onPress...and not run its onPress logic (even though there's a press)? Again, I'm struggling to understand the logic here (likely because I'm in a bit of a rush and not able to fully concentrate at the moment). Any chance you could explain it like I'm a 5-year old?
  9. Glad to hear the ES6 stuff works well. As for the <body> not working, I bet you just called your script in the wrong order. In other words... //BAD: <script> TweenMax.to("body"...); //<body> doesn't exist yet!! </script> <body> ... //GOOD: <body></body> <script> TweenMax.to("body"...); //no problem. <body> exists. </script> Does that resolve things? If not, please post a reduced test case that I can take a peek at.
  10. I didn't quite understand your (2) - isn't that behavior exactly what Draggable already does? Hold your mouse near the edges and it keeps scrolling. The closer you get to the edge, the faster it scrolls. As for centering it when the element is thrown outside the bounds of the wrapper, I updated the codepen to show you a technique for doing that: I hope that helps!
  11. Split text removing spaces

    Or just a simple <span> with a margin, like: <div id="blueBox">hi<span style="margin-left:5em"></span>greensock</div>
  12. .addPause breaks upon interaction with slider

    That's just because you've got an error in your JS code that's referencing a non-existent object (progress): progress.html(tl.progress().toFixed(2)); If you look at the console, you'll see a bunch of errors getting spit out. Once you remove that line, it looks like it all works perfectly Let us know if you've got any other questions.
  13. ScrollTo Plugin - problem in W10 Firefox

    First of all, welcome to the forums, @closerlook. Thanks for being a Club member. Short answer: Set the autoKillThreshold to a lower value (default is 7): ScrollToPlugin.autoKillThreshold = 3; And make sure you're using the latest version - the codepen you posted is using a very outdated one. I know, it's counter-intuitive because it's pointing to the "/latest/" directory on the CDN, but unfortunately CDNJS stopped supporting that years ago and they refuse to update files there. We begged...they denied. So just point to /1.20.4/ instead, and you'll be golden. Explanation: autoKill is enabled by default which means that ScrollToPlugin will automatically check to see if the value that it set on the scroll value last has been changed. If so, that means something else (typically user interaction) made it change, thus the tween should be killed (well, that part of the tween at least). The problem is that some browsers (like iOS safari) are pretty sloppy with those values, so even if (for example) ScrollToPlugin sets it to 112, Safari might alter that slightly (without any user interaction), so we had to build in a tolerance. That's where the autoKillThreshold comes in. Does that solve things for you?
  14. GSAP is undefined if a dependency uses GSAP too.

    @ard.weisrock we're hoping to push 1.20.5 out officially this week. Stand by for that
  15. Aha! I see what you mean now, and I think I figured it out. Angular was somehow loading GSAP before "document" was even defined, thus when it internally cached that as a variable, it was undefined. That explains why you were able to see "document" right before you did your tween, but it still wasn't defined inside GSAP. Kinda weird that Angular would do things in that order, but I think I've got a workaround in place in the upcoming release (due out VERY soon). In fact, we're also switching to ES modules in the default package that'd distributed via NPM, and that seemed to resolve things anyway. Please give these files a try: https://greensock.com/temp/GSAP-ES6.zip Better? Notice there's a "umd" directory if you still need that older style, but I don't think you will. ES modules appear to work great in that environment. Please let me know if those updated files resolve the issue for you.