Jump to content

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


  • Posts

  • Joined

  • Last visited

Recent Profile Visitors

1,933 profile views

gaggo's Achievements

  • Week One Done
  • One Month Later
  • One Year In Rare

Recent Badges



  1. That looks great! Intuitively, I was looking for an option for that behavior.
  2. Hi there, just a quick question: In the documentation of MotionPathPlugin, it says this: // plot a curve through these coordinates. The target's current coordinates will automatically be added to the start: motionPath: [{x:100, y:50}, {x:200, y:0}, {x:300, y:100}] Is there also an option to NOT add the target's current coordinates to the path?
  3. Hi Carl, thank you, this looks exactly like what I was looking for!
  4. Hi there! Sometime last year, I read a post somewhere here on the gsap docks about generically tweening the position and dimension of an element after moving it in the dom. I can't find it anymore – does someone (maybe Jack himself?) remember the post and maybe has a link?
  5. Thank you @OSUblake! Also thanks for the hint about gsap.registerEase() !
  6. ...just one more question: What exactly is the difference between importing from gsap/all with destructuring vs. importing every single package from gsap, gsap/Plugin1, gsap/Plugin2 , as shown by Jack above? I am using the /all approach in many of my projects, it works fine and is less verbose, e.g.: import { gsap, CustomEase, ScrollToPlugin, Power4, Linear } from 'gsap/all'; gsap.registerPlugin(CustomEase, ScrollToPlugin); gsap.registerEase(Linear, Power4);
  7. @OSUblake you are right. I had to npm uninstall gsap --save before running npm install gsap-bonus.tgz --save again. Now I have all the files available, and it works, yayyy!
  8. I just tried copying the contents of the unpacked "package" folder manually to my node_modules/gsap folder, and voila, now it works. But this is certainly not the intended behavior, right? Maybe some issue with NPM? My npm --version: 7.5.3
  9. Hi there! I managed to get it working on codepen: https://codepen.io/hirasso/pen/QWdaNrw ...but I keep having trouble with the bonus plugin in my project. I downloaded the gsap-shockingly-green.zip from my profile and installed the file "gsap-bonus.tgz" with npm install gsap-bonus.tgz --save – but it doesn't install the bonus files in my node-modules folder. Screenshot #1: the contents of the .tgz file. Screenshot #2: the files in my node_modules "gsap" folder after running the above command. Weird...
  10. Hi there, Since this is a question about a premium plugin, I don't know how to create a test case on codepen. But maybe this is an easy fix anyway? I am trying to make use of Draggable like this: Draggable.create($element, { bounds: $wrap, edgeResistance: 0.5, type: "y,x", inertia: true, }); Here is my gsap import: import { gsap, CustomEase, ScrollToPlugin, Power4, Linear, Draggable } from 'gsap/all'; gsap.registerPlugin(CustomEase, ScrollToPlugin, Draggable); gsap.registerEase(Linear, Power4); ...it works, but is not "throwable", meaning, it stops being dragged immediately when I release my mouse. Also snaps back into the bounds instantly on release. I thought I could control this behavior with inertia being set to true? I don't get any warning in my browser console.
  11. From MDN: Since in my ./js/app/index file I have the main class and also call it from there, I thought this would be exactly what I wanted...
  12. For future reference: I posted an issue over at the parcel bundler github page: https://github.com/parcel-bundler/parcel/issues/4956
  13. Hi Jack, Thanks so much for your quick feedback! The issue was caused by my setup. I had a main index.js file, that's only purpose was to imported the main app.js, some scss and had a bit of bundler-specific code: // app code import './js/app/index'; // app scss import './scss/app.scss'; // some bundler-specific stuff if( module.hot ) { module.hot.accept(() => { window.location.reload(); }) } With the above setup, I kept getting the mentioned error when scopeHosting was enabled. I've spent an hour to get to the bottom of this, and it turns out it was due to the Side Effects Only import of the ./js/app/index file 🤯. So fixing it was as simple as that: // Named import of app.js to support scopeHoisting import App from './js/app/index'; // app scss import './scss/app.scss'; // bundler related stuff if( module.hot ) { module.hot.accept(() => { window.location.reload(); }) } The weird thing is, that it worked just fine with all my other node_modules. I will post at the parcel issue tracker, maybe we can find out more about it there.
  14. Hi there! I'm not sure if it's a problem with my bundler (parcel) or with gsap – I can't get parcel's scopeHoisting ( = tree shaking ) to work with gsap. It works just fine with all other libraries I use. This is what I do in my script: // GSAP in with bundler, as seen here: https://www.youtube.com/watch?v=znVi89_gazE import { gsap, CustomEase, ScrollToPlugin, Power4, Linear } from 'gsap/all'; gsap.registerPlugin(CustomEase, ScrollToPlugin); gsap.registerEase(Linear, Power4); If I bundle this without tree shaking, I get no errors. But as soon as I enable it, I get this error in my console: ../node_modules/gsap/all.js does not export 'gsap' I am using the latest club gsap, with npm and gsap-bonus.tgz Any ideas?