Orbital Animation on webflow tabs

Design help Layout & Design
1

animation
animation1225×672 52.2 KB

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)

2

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
3

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

1 Like
4

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

1 Like
5

Hey another quick quetion related to same orbital tab

6

Hey Michael

publish error
publish error1920×1080 163 KB

. How are you?
There is been an issue with my site its not publishing Read only link

7

Hey Mr. Agha,
Looks like some kind of systems issue, you’ll need to contact Webflow for that.

8

It’s only happening when i add stripe in my e-commerce even the stripe is verified and webflow ecommerce is on business plan.

1 Like
9

I saw someone else post the same issue today somewhere. Has support responded yet?

10

Yeah ,but haven’t got any update related to fixing just the issue sent to them.

1 Like
11

If you see the post from named alexander he is the client i am doing for him.

1 Like