Fancy hover effect with anchor positioning
A few experiemntation usign Anchor Positioning to create fancy hover effects. Highlight the menu items with a sliding effect.
See the Pen Menu hover effect (with Anchor Positioning) by Temani Afif (@t_afif) on CodePen.
Or jumping effect.
See the Pen Menu hover effect (with Anchor Positioning) by Temani Afif (@t_afif) on CodePen.
More CSS Tips
- Inverted border-radius using CSS mask One property and 4 gradients to invert the corner of any element with a radius.
- Circular progress using scroll-driven animations Transforming the native progress element into a circular one using scroll-driven animations.
- Custom range slider with tooltip II Using modern CSS features to create a fancy range slider with tooltop.
- Better text wrapping using text-wrap The text-wrap property allows you to control how text is wrapped.