Orbital Animation on webflow tabs


So here is the thing am working on this project client want a tab animation like when the user click on tab the tab data should be change well thats simple but he also wants that when one tab is selected the border color of from that tab to other should be change like it should make a circle the tab is already positioned inside a single circle so ho can i convert a single circle into 6 pieces and make it a circle? coz without brekaing the circle i cant change the border-color of specific width/tab area.


Here is my site Read-Only: LINK
(how to share your site Read-Only link)

I think I would normally just use interactions for this however if a client needed the ability to edit tab-specific content than using a tabs element may be preferred.

In terms of color, can you just assign a background color to a tab-specific subclass, and then have your click interaction change e.g. background contrast?

1 Like

I thought this was really cool, so I’ve played around a bit and it ended up in a cloneable + video tutorial.

Michael you are a true gem you are genius and i love the dedication you have shown in this.

Hey another quick quetion related to same orbital tab