Jump to content

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

GreenSock last won the day on August 23

GreenSock had the most liked content!


  • Content Count

  • Joined

  • Last visited

  • Days Won


GreenSock last won the day on August 23

GreenSock had the most liked content!

Community Reputation

8,352 Superhero

About GreenSock

  • Rank

Contact Methods

Profile Information

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

Recent Profile Visitors

48,495 profile views
  1. Yep, I believe they are embroidered. And FYI, DJM Designs (the outfit providing the apparel) is run by one of my very best friends (he was the best man in my wedding). I tried places like Zazzle and others, but frankly the quality sucked. The shirt looked nice...until I washed it twice and then it fell apart and faded. DJM uses high-quality stuff that has lasted me for years. So yeah, if you want a t-shirt, hat, or whatever, DJM can hook you up. If you run into any problems, let me know and I'll show up at his home and give him a talking-to
  2. Yep, exactly. Maybe check out the "getting started" article. As for that jquery.min.js file, that's pretty weird - you can ignore that altogether. It looks like an old minified file (with the wrong name). Sorry about any confusion there.
  3. @Luckyde I just shot you a private message with an answer (because it's related to an upcoming release that isn't public yet)
  4. Yeah, that's exactly what I was gonna recommend - use a SteppedEase on your main animation, pause() it, and animate its time or progress value with another ease that uses an easeInOut. Should work great. 👍
  5. Welcome aboard! I think this will help you conceptualize things pretty well: https://codepen.io/GreenSock/full/djXzyR/ TweenMax already has TimelineMax INSIDE of it, so there's no need to load them both. In most cases, TweenMax is all you need. If you need some extra special sauce to do a particular effect, you may need to load one of the other plugins. The ".min" in the file name just means that it's a minified file. We include all the uncompressed files as well as the minified versions, just so you have options. You'd never used an uncompressed file on your actual live site - always go with the minified one. But sometimes it's nice to read the uncompressed source code or load it locally just for debugging. I really wouldn't recommend using the jquery plugin unless you have legacy jQuery.animate() code that you just want to give a speed boost. Otherwise, dump that and use GSAP to animate everything. If you're just looking to load stuff into a web page and get going fast, the /minified/ folder has all that you need. Does that help? Happy tweening!
  6. It looks to me like the problem is inside your onComplete where you have this: $("#text-01-01").removeAttr("style") You're removing that whole attribute - why? My best guess is that when you remove it, Safari actually detaches it from the element itself, and creates a whole NEW style object for it, so the one that GSAP is animating is...detached. If you're trying to remove or reset values, there are better ways. Like using clearProps:"all" (though I still don't understand why you'd need to wipe the styles in this case)
  7. That's likely because of some complexities involved with not linking it to a specific animation, thus it has to jump through some hoops to globally synchronize things but I'd recommend just pointing it at your animation like this: GSDevTools.create({animation:master}); Seems to work fine that way. Thanks for joining Club GreenSock!
  8. That's great! We love it when people pitch in to help others around these forums. It's what makes this neighborhood so special. And if you like GSAP now...just wait till you see what we've got coming in the next release. Club GreenSock members will be getting early access pretty soon Happy tweening!
  9. You definitely shouldn't be using that file you linked to - that's just for Codepen demos (it'll redirect if you try using it on a different domain). Use the CustomEase file that you get in the download from this web site - log into your account and go to the "Downloads" section of your account dashboard. That has CustomEase in there. You could drop it into your node_modules/gsap folder or just use it loose, as long as you've got GSAP installed via NPM it should work okay but I'm not familiar with every build tool out there so your mileage may vary.
  10. Yeah, that's pretty odd indeed - it seems to work great if you switch from CSS to using GSAP to animate it. Yet another reason to use GSAP My guess is that it has to do with compositing layers and maybe how CSS animations get spun off to a different thread - sometimes that's actually a BAD thing. Having it all synced up with frame refreshes/ticks (main thread) can be good. You could try animating something else ALSO that's not transform-related, just to see if that'll force Safari to repaint the screen and mark that element as "dirty" (needs repainting). I wish I had a silver bullet for you...other than just using GSAP for the animation
  11. Welcome @kevinMario! Yeah, this is an overwriting issue. When a tween renders for the first time, it checks to see if there are any other tweens of the same property (on the same target) and if any are found, it kills them so that they're not fighting for control. Otherwise, you'd have one tween making the property go one direction, and another tween making it go in another direction. That's what we call "auto overwriting". You have overlapping/conflicting tweens - that's what's causing the problem. The reason it works the first time is because overwriting doesn't occur until the tween renders for the first time. So as soon as the 2nd tween starts, the first one gets killed (and that one doesn't come back). Therefore, the second time through the timeline, that first tween is dead. You can easily see if there's an overwrite happening by using the TweenLite.onOverwrite static method: TweenLite.onOverwrite = function(overwrittenTween, overwritingTween) { console.log("overwritten!"); } You can either prevent them from overlapping (adjust your code) or you could set overwrite:false on your tweens. Or set TweenLite.defaultOverwrite = false. I hope that helps!
  12. But how would the plugin get the appropriate stuff from PIXI then? For example, it must access PIXI.filters.ColorMatrixFilter, PIXI.Graphics, etc. Where would the pointers go?
  13. Yep, I guess it doesn't have to be the official PIXI object - just something that has DisplayObject, filters, VERSION, and Graphics properties that point to the corresponding values in PIXI. And you're welcome to try feeding that into PixiPlugin.registerPIXI() if you don't want to attach it to the window.