nolafs

Thanks for looking into it. I understand but putting this in CodePen will not actually throw the error. Is most likely something else is buggering up the site pin init. Regarding the version, it is very strange, I use npm to load GSAP. The site is generated on netlify and should always load the latest version. I have no idea where that old version is loaded from. I have a look.

The page contains a small Angular application but Scrolltrigger is not imported into the app. I was wondering about the same. The angular application does not import ScrollTrigger at all. Here is page with pin activated https://637f4caaccf1f50008f1f54c--determined-keller-77949e.netlify.app/careers/ On the live site, I removed the pin. Overall the performance seems to better without it anyway. The angular application is small block at the bottom for the job listings. https://www.firesprite.com/careers/ Cheers Olaf

Hi, I experience a very strange error. It does not happen every time I do load the page. Sometimes it just recovers or no error at all. I can create the error relative consistently if use history button to go back to page. polyfills.js:1 Uncaught TypeError: trigger.revert is not a function at _revertAll (ScrollTrigger.js:423:1) at _refreshAll (ScrollTrigger.js:468:1) at v.invokeTask (polyfills.js:1:7158) at M.runTask (polyfills.js:1:2553) at m.invokeTask [as invoke] (polyfills.js:1:8209) at Z (polyfills.js:1:20772) at N (polyfills.js:1:21167) at B (polyfills.js:1:21331) at _swapPinIn (ScrollTrigger.js:624:1) at ScrollTrigger.init (ScrollTrigger.js:1121:1) Also not consistent, some user experience they cannot actually scroll page. The scroll bar works but page is not actually scrolling. Any idea why?

With ScrollTrigger, you can trigger animation on scrolling, with ScrollSmoother you can control the speed of your scroll.

Nope, using npm. It is an older project, I am upgrading to webpack 5. I just managed a failed build without the import errors from GSAP. My netlify.toml had and older npm version set in the build.environment. Since I upgraded it to 8.5.0, no GSAP errors but scrollMagic is playing up now. Joy of upgrading old projects. Will remove it anyway in favour for ScrollTrigger.

Hey, Driving me nuts for past day. Everything works perfectly fine testing and building the site local. When I push the update to build the site on Netlify, it cannot resolve any GSAP modules. Any idea?

Actually I might found the issue. One of my classes was importing UMD and another the module. That seemed to have caused the issue. Thanks

Doing a demo in CodePen isn't going to work, as it seem, the issue has to do with scaffolding. I will try creating two build on Netlifly tomorrow. Different imports.

As I am using webpack, the modules should be the correct import but it behaves terrible. Is seems it is unable to update when scrolling. It is jumpy and choppy. The animation is super simple. ``` gsap.utils.toArray(".parallax").forEach(layer => { const tl = gsap.timeline({ scrollTrigger: { trigger: layer, start: "top top", end: "bottom top", scrub: true, markers: false } }); const depth = layer.dataset.depth; const movement = -(layer.offsetHeight * depth) tl.to($(layer).find('.imageWrapper'), {y: movement, ease: "none"}, 0) }); ```

Yeah, I start turning off some stuff including the smooth scroller. That did improve the animation but it still not 100% smooth and jumpy at times. It seems to perform just a bit better in Safari too. Very frustrating, spend days on my local build to optimise the animation and now the production build just won't work. On thing I did notice, when I import import { ScrollTrigger } from 'gsap/dist/ScrollTrigger'; I get good performance on my development but import { ScrollTrigger } from 'gsap/ScrollTrigger'; Impossible jumpy and choppy animation but on my Angular webcomponent, complete the other way around.

Hi, I am having issues with production builds using ScrollTrigger. The animation is smooth as butter under development build but when all minimised it is choppy and unusable. The site uses a couple of angular web-component which compile their own version of ScrollTrigger which seem to work fine. Something seem to go wrong when minifying and combining the page js files. It beats me why Angular production compile doesn't have the problem. Anything tricks I might missed when setting up my webpack production build? Cheers Olaf

I notice a strange behaviour. For some reason, my scroll container gets set to opacity 0 at some point. No error, randomly. Anyone experience the same issue?

Hi Jack, Actually that line of code is causing the error. My guess is that Angular Universal cannot render it as it has DOM. So anything that might tries to select an element will through an error. Just speculating, the only solution is to check if the platform is browser and only init the plugin if this is true.

Hi guys, I am trying use the draggable plugin in one of my components in angular. All is working fine but the universal server build doesn't like 'registerPlugins'. It all builds fine but server errors with Uncaught (in promise): TypeError: Cannot read property 'style' of undefined TypeError: Cannot read property 'style' of undefined Any ideas? Cheers Olaf

I need to install the bonus packages with yarn. Npm seems to work but yarn, it just hangs. Any idea how I can resolve this?