Thank you for your reply!
Re: You would like to have the link inside of the tab, instead of the tab being the link?
Yes, something like that. Now i’m using the tab content space for the images. I guess I’m doing it wrong. But this is the only way I could think of to achieve this. Any ideas?
I found this video- but I have no idea how this guy did this.
Hey @vincent - I’m trying to solve exactly that , have a link inside a tab that takes you to a project.
I’ve taken a flowbase tabbed slider template, and customized it so that when I click on a tab, the project is visually previewed , AND a ‘VIEW PROJECT’ text link would appear on that tab to let your second click take you to the project… but I can’t activate a link in the tab.
I thought this would be a cool way to display 4 portfolio projects in one area, and work great for mobile.
Is there a way to force this link within a tab? Or do I need to go back to the drawing board on this one?
What do you mean by “solving that”?
Sorry! I meant to quote what you said on your previous reply to Cipriano:
“You would like to have the link inside of the tab, instead of the tab being the link?”
I’d like to have the tab be clicked, then a VIEW link appears through an interaction sequence I made, then you click ‘VIEW’ to see that project.
It’s like the tabs are being used for previewing a project hero image, then the VIEW link takes you to it…
In your above image, did you get the ‘Link To Project’ links actually working?
Yes, but it’s a cheat
I have placed inside of the TAB PANE the same kind of element as the TAB MENU: same dimensions, with 4 children, etc. And I have positioned it with Absolute on top of the TAB MENU.
So maybe you can work out a solution using that technique. Because you will not be able to place a link in the TAB MENU ITEM.
Great thanks! I’ll give it a shot
For those of you that ended up here trying to achieve what Vincent did above, be aware the webflow tab content element defaults to
overflow: hidden. I just spent the whole afternoon troubleshooting z-index thinking that was the issue, hopefully you won’t have to. Though reading more in depth about stacking context and finding a stacking context dev tool extension was fruitful as well.
I found a smooth solution:
You have to put an embeded html inside the tab component. Now you can put a Div with a onlick Link:
Do not use a
<a> Tag it need to be a
Have a nice day,
You are god @FlowerLuca
I spent so much time on this “problem” and your code run perfect in my project.