Scroll up/down animation not working with scroll wheel

Design help Animations & Interactions
1

I’ve set a scroll up/scroll down animation to adjust the size of my navbar from 100 → 80 when scrolling down, and 80 → 100 when scrolling down. Problem is, when I use my Logitech Master mx3 mouse and do one scroll click down, it doesn’t work.

Video here of problem: Loom | Free Screen & Video Recording Software | Loom

In the video, you can see that when I do one click of my scroll wheel down, it doesn’t work. I need to scroll fast to activate the animation. How can I fix this?

Here is my public share link: https://preview.webflow.com/preview/kevinchiang?utm_medium=preview_link&utm_source=designer&utm_content=kevinchiang&preview=b910d49bc153fb51628490ff72538128&workflow=preview

2

Great question, @Kevin_Chiang, and welcome to the community! :smile:

I made a quick video walking through what’s happening here and how to resolve it:

1 Like
3

Yes, that solved it!! THANK YOU!

1 Like
4

Oh wait, it broke responsiveness :frowning:

https://preview.webflow.com/preview/kevinchiang?utm_medium=preview_link&utm_source=designer&utm_content=kevinchiang&preview=b910d49bc153fb51628490ff72538128&workflow=preview

Do you know what’s the problem here?