Community forum for knowledge and support

Updated last year

Smooth Out The Hover Transition

At a glance

A community member is seeking help to smooth out the hover transition on a website they are working on. They have provided a link to the website preview. Another community member suggests changing the transition from "bottom" to "Box Shadow" and reducing the duration to 200-400 ms to make the transition less abrupt. The original poster confirms they have made changes to the animation, but does not explicitly state whether the issue has been resolved.

Useful resources

SSara Margolies

How can I smooth out the hover transition here?
https://preview.webflow.com/preview/openshift-website?utm_medium=preview_link&utm_sour[…]e&preview=9c8603e1ba6f71b5502c5dcc0428accd&workflow=preview

You'll see it moves up very abruptly.
Thanks

2 comments

EEmmett Armstrong

You're close; instead of selecting "bottom" here under the Transitions section, switch it to Box Shadow. Also you probably need to drop the duration down to 200 - 400 ms. Otherwise it's TOO long and you won't notice because it happens too slowly.

SSara Margolies

Thanks ! I meant to delete this message because I change the animation. It was at first moving up a bit

Add a reply