elegantseagulls
-
Posts
587 -
Joined
-
Last visited
-
Days Won
11
3 Followers
About elegantseagulls
Recent Profile Visitors
5,381 profile views
elegantseagulls's Achievements
-
Your codepen has JS and CSS in the HTML section. When I pull that code out, it seems to work just fine for me.
-
I think you are getting confused as to what React is doing and what GSAP is doing... This will be helpful:
-
gsap.timeline({...})
-
You don't have a gsap tween in this.
-
I'd think that adding a value to your scrub (eg: scrub: .5) and having the entire animation in one ScrollTrigger scrub would be the way to go here.
- 1 reply
-
- 1
-
-
Yeah, that sounds like it could be taxing on even medium-powered devices. This might be something to look into canvas/webgl for.
-
Not really... without having the actual device it's really hard to tell what it's actually going to do. The original SE is probably a good baseline for a lower-powered device these days. Just make sure you are following best practices (animating properties that can be hardware accelerated, etc).
-
Is there a method that can run a function after gsap.to
elegantseagulls replied to nthpolygon's topic in GSAP
onComplete should be doing the same thing... To note you'll want to do onComplete: functionName, not onComplete: functionName() as this will run the function immediately. More info on the callbacks here:https://greensock.com/docs/v3/GSAP/Timeline/eventCallback() -
That site is animating the clip-path property. You could probably just do something like gsap.fromTo(img, { clipPath: 'inset(0, 0, 100%, 0') }, { clipPath: 'inset(0, 0, 0, 0') });
-
Progress Bar works 90%+ of the time, but sometimes breaks on resize
elegantseagulls replied to aw55566's topic in GSAP
So animating height isn't very performant. You may have better luck setting the progress bar to height: 100vh; with a transform-origin: top center; then animating the scaleY from 0 gsap.from(progressBar, { scaleY: 0, scrollTrigger: { ... }} This way you wont need to calculate the window's size on refresh. -
My GSAP animation only works when logged into wordpress, elementor
elegantseagulls replied to BigDaddyFresh's topic in GSAP
Where are those scripts defined (Wordpress can be funny about this sort of thing if you have scripts specific to being logged in, etc)? Are you sure that script is running, and those elements are available to be animated when the script runs? -
Do you have the private NPM module installed with the bonus files?
-
It's not a baked in feature, but it's possible: You'll need to use draggable's callbacks to get current dragged position/coordinates and then re-map those coordinates with a little math to the preview box.
- 1 reply
-
- 2
-
-
If you use a chrome-based browser you can download the extension to see just how many sites are using GSAP (It's a lot) https://chrome.google.com/webstore/detail/official-gsap-sniffer/dbcjaehchnikgdjjcehagpcikmlpjefh
-
Do you have a minimal demo showing that's happening here? Are you resetting the ScrollerProxy to body, or whatever is the new scroll-container?
