We can’t seem to figure this out despite this being seemingly simple to do…
We have a tab with 4 tab items: All, Toners, Serums, Moisturizers.
What we want to do:
- When there is no hovering on any of the tabs, tab text should all be black. When we hover over one tab, this tab should remain black text while the other tabs will turn grey. We sorta got half of that, just cannot seem to figure out how to keep the tab that we are hovering on to stay unaffected by the mouse hover trigger. How can fix this?
- If the user is on the current tab, the underline should remain. We got the underline to appear on hover and disappear when hover out. But cannot seem to get it to stay if the user is on the current tab…
Here’s pretty much what we want to achieve:
Here is my site Read-Only: https://preview.webflow.com/preview/test-ep-website?utm_medium=preview_link&utm_source=designer&utm_content=test-ep-website&preview=3f0a7d688386b736f7b6761ffbcac88b&pageId=5f3741de575933b01155a743&mode=preview