Astroboy

Sorry about that, I was working on putting this together. So my main issue is: When I move my mouse off of the links, the animated letters don't move back into their original place. It seems I'm having more issues than I initially thought. I totally understand if this is too big of an issue. I'll keep working away on it and return when I've narrowed down the issue

Hi, I'm having some troubles migrating an old TweenMax animation into GSAP 3. I've gone through all my code while following this guide, but I still seem to be having some issues. I think I've found the function causing the issues: resetTilt() { if ( !activeTilt.letters ) return; gsap.timeline() .to(this.DOM.randLetters, 0.2, { ease: "power3.inOut", y: cursor.direction === 'up' ? '-=80%' : '+=80', rotation: cursor.direction === 'up' ? '-=10' : '+=10', opacity: 0, }, 0) // here .to(this.DOM.randLetters, MathUtils.getRandomFloat(0.5,0.7), { ease: "power3.inOut", startAt: {y: cursor.direction === 'up' ? '80%' : '-80%', opacity: 0}, y: '0%', rotation: 0, opacity: 1 }, 0.02, 0.2); } This returns me an error of: "Cannot create property 'parent' on string __".... I'll work on creating a minimal codepen, but I figured I'd post this for the meantime just incase I'm missing something obvious.. Thank you!

I didn't know about toggleActions.. thank you this works perfectly!

Hi thanks for the reply. Sorry for the lack of detail. By "refresh" I mean; say I scroll down through my page, and the scrollTrigger animates my titles in.. if I scroll back up to the top of the page and click a button, I want to attach a function to said button to 'restart' or 'refresh' or 'reset' my timeline... essentially have the scrollTrigger start from the beginning.. it would give the same effect as 'once: false' but unfortunately that is not an option for me.. The issue I have with restart() is it plays the animation right away, but I want it to wait until I hit the 'trigger' again Sorry for the poor explanation.. I'm using swup.js and it causes a bunch of confusion and issues, I will work on creating a demo.. Thank you!

Hi, I'm trying to figure out what I'm doing wrong in my attempts to "refresh" my gsap scrollTrigger. This scrollTrigger is set up to animate some titles on my page, but I'm having difficulties attaching a "refresh" function to an event listnener. I've tried both both methods found here https://greensock.com/docs/v3/Plugins/ScrollTrigger/refresh() with no luck.. (the animations to not refresh and I notice no changes at all) I'd greatly appreciate any help let gltl = gsap.timeline({ scrollTrigger: { trigger: "#title1trig", onEnter: animate, once: true } }); function animate() { gsap.set('.title1Char', { transformOrigin: "center center 10px" }); gsap.set('.title2Char', { transformOrigin: "center center 10px" }); gltl.from('.title1Char', { rotationX: 190, y: 20, stagger: .05, duration: 3, ease: 'elastic(1.8, 110)' }) gltl.from('.title2Char', { rotationX: 190, y: 20, stagger: .05, duration: 3.5, delay: -3, ease: 'elastic(1.8, 110)' }) } refresh.addEventListener('click', () => { gltl.scrollTrigger.refresh(); })