Easing not working

Design help Animations & Interactions
1

Hey all, I set up a navbar that disappears on scrolling down and reappears on scrolling up, following the instructions here. The disappearing part works great, but when it reappears it’s like the easing part of the interaction just doesn’t work: it always appears suddenly as if it had no easing at all.

I’ve tried multiple different easing presets, with multiple different durations. The durations work, but the easing never does. It’s like this in the preview and the published site.

Any clue what’s going on?

Here is my public share link.

2

Hey @sigurdur130!

The issue here isn’t your easing, but the units you’re using for the actual animation. The height of your navbar is 4.5rem, your “disappear” animation is telling the nav bar to move up 4.5rem — all good. The issue is when you tell the navbar to come back down to 0px.

By simply switching your 0px to 0rem, everything should work a bit better!

Give it a shot :+1: