Jloafs

That's perfect, thanks heaps.

Thanks, yes that's right. How do I revert back to the original state after the end of the trigger? Ideally I want to change the opacity only while the a tag is in the center of the screen.

Hi guys I'm trying to run a simple opacity animation on each element with the class .recipe-link using scrolltrigger but something isn't working. If anyone could point me in the right direction I'd be really grateful. Apologies if this is me missing something totally obvious - I'm a js novice. Many thanks.

Ah, of course. Thanks heaps.

Hi. I'm just playing with the new scrollsmoother and wondered if there's a simple way to disable on certain pages rather than apply globally? I notice it automatically creates ids for a scrollcontainer on pages that don't specify a smooth wrapper.

Thanks @akapowl I'll chew this over a little bit. Thanks heaps for your help.

Thanks @akapowl That gets someway there but it doesn't seem to quite snap to the top properly. Is there a way to force the snapping as soon as the section scrolls in? At the moment this can kind of get stuck between halfway 2 sections or it reaches the top after a wee delay which doesn't feel smooth. https://codepen.io/jloafs-DM/pen/zYRyYGp

I'm just playing with scroll smoothing ( which looks amazing) but ran into an issue with position sticky. The desired effect is that each section in this pen should be sticky and not scroll off the top of the viewport with each subsequent section scrolling in over the top. As soon as I add scrollsmoothing into the mix this breaks. Any thoughts? Ideally I'd like the sections to animate to the top as soon as they enter the view port. Any help would be much appreciated - I'm not an expert btw (understatement).

Found it.

Hi guys I'm a club greensock member and I can't recall how to download any of the gsap plugins - can someone please point me in the right direction? Best Jason

managed to fix this - was easier than I first thought - cheers Zach.

Thanks Zach. You're right - the flex grow property is definitely the way to go. I've put a basic pen together but it's a long way off working. I've been trying to get the sidebar nav to toggle the active class that applies the flex-grow to the active sidebar element. Ideally would eventually want to hook this up to scrolltrigger too so that the sidebar elements navigate as their associate section scrolls into view. Any thoughts on how to handle this? Sorry I'm a bit out of my depth https://codepen.io/Jloafs/pen/GRvOWNa

That's what I thought initially but I couldn't figure out what flex properties to use to position nav elements at the bottom then animate to the top - what are the 2 position states I need to use? Each item in the nav needs to push up to the top individually (pushing the nav item above it up without moving those below it). Does that make sense?

Hi all Does anyone have any idea how to achieve this. I'm trying to animate this menu so that the menu items move from top to bottom (shown in the attached images) when clicked or based on scroll trigger position. The triggers are not the issue - I just can't figure out what properties to animate. I had initially thought I could achieve using justify content etc but that doesn't work. Many thanks for any help.

Yeah, apologies. I carried on and got it working. Many thanks - really helped me to get my head around how to start it all off.