milko

Webflow Read-Only: https://preview.webflow.com/preview/cfv2colstarter-ba45ccc944d42500d90b08c7?utm_medium=preview_link&utm_source=designer&utm_content=cfv2colstarter-ba45ccc944d42500d90b08c7&preview=4f45f495fffbea24956c1168c351c6e5&workflow=preview CSB: https://codesandbox.io/s/taimen-jn3rn6?file=/index.js Live: https://cfv2colstarter-ba45ccc944d42500d90b08c7.webflow.io/

Thanks @Geoff Dawes Unfortunately this didn't work! @___wtem___ neither did the display:flex 😕 I've noticed that after expanding the navigation there is a horizontal overflow/overscroll. I have forgotten about the second same #taimen ID, but it seems that this wasn't the problem. Maybe my overall approach is the issue? I mean even if this works, how will I make it always be on top so there is no negative space between the expanded nav and the navbar itself? 😕

Hey @Rodrigo! Appreciate your answer maan, thank you! Unfortunately, since this is Webflow, a nocode tool i am unable to reproduce the issue in another container either because it doesnt allow me to export the elements correctly or due to coding inability!

Hello guys!! First of all I have to say how happy I am to finally overcome my fears and get to try the famous 'gsap'! Thank you for your hard work!! Now onto the issue.. Sorry I didn't know where else to grab some help.. I want to implement it in a client's project inside Webflow, and I thought I was doing good but.. Expected output: Taimen logo (#taimen) on first scroll will just be resized to ~300px and after this, scroll continues normally. Ideally no position changes. 1. When serving it from my node/localhost the script loading was instant, but now that it's served from the cloud there is a weird jumping, I think probably after the ScrollTrigger is connected? 2. Although it does somehow works , when opening and closing the .nav-expand from hamburger menu, which is also controlled from gsap, the the resizing of the logo after the scroll and the whole .nav makes a weird flashing/jumping. PS: is my approach to the resizing of the logo on "first scroll" correct? (in case the approach is correct, I can't seem to solve this case: when user has scrolled and the logo is resized - if user clicks the hamburger menu there is a severe white space which breaks the layout (image attached). Probably due to pinning?) Argh. Feeling so lost here. Site link (made in Webflow): https://cfv2colstarter-ba45ccc944d42500d90b08c7.webflow.io/ CodeSandbox (for gsap - they are connected): https://codesandbox.io/s/taimen-jn3rn6?file=/index.js (Inspiration https://www.stord.com/ (but in my case I need only the 1st scroll))