Make a Tab Unclickable

Is it possible?

Kind regards

Share Link: https://preview.webflow.com/preview/tempus-7b110f?preview=524cf90398d61dc07d0c6659e799a257

I don’t know the reason behind this… I have the feeling that there’s a different and better design solution for what you’re trying to do.

Anyhow, you can overlay a transparent div on top of the tab maybe and it wil prevent anyone to click on it.

Already tried this, unfortunately doesn’t work. Check out my share link and you’ll understand why this is the reason I need to design it this way in webflow. Thank you anyway. Any other ideas?

Can you give me the sharing link?

Using JS or JQuery you could

a Tab is basically a link in a div.

If you remove the w-tab-link class…
it will remove the link but keep the link in place.

If you instead replace w-tab-link with another class that looks like the tab… the viewer would never know.

I think it is missing, or am I missing something?

1 Like

Hi Vincent, just updated it!

Hi samliew, just updated it!

Can you tell us what page and what section it is? Screenshot would be cool. Thanks.

This is the one, basically there are dates on this tab that I don’t want to be clickable.

Try this: give a class .not-active to the items you want to be not active, then add a custom code:

.not-active {
   pointer-events: none;
   cursor: default;
}

And it works, to my surprise.

Sauce: http://stackoverflow.com/questions/2091168/disable-link-using-css

3 Likes

Brilliant, will give it a try now. Thanks!

If you put the code in a HTML embed instead of in a custom code at page or site level, it will act directly in the designer, FYI.

1 Like

Thanks, just put it to the test and it works! That’s one less thing to worry about!

This topic was automatically closed 60 days after the last reply. New replies are no longer allowed.