Jump to content

Unusual Curvy Tabs


Recommended Posts

I have a situation where a curvy tab design is being used.


Here's the mockup design with some key points in red.


I like to use this script for the tab script but I just not seeing how I can achieve this result according to the design.


I am open to other options if it provides me the desired results I am looking for.

Edited by newseed
Link to comment
Share on other sites

I ended up using this example because it seems pretty straight forward. Here's the results of the tabs I did.


It looks good. These tabs will indeed have content in them just below the tabs. However, the all the tabs content will be on the same page. I know how to make a tab link active for whatever page is being displayed but what I don't know is how to make a tab link active for a content that is within the same page.


I have googled various types of scripts that allows you to do this but it all seems to be an overkill and that it seems that I would have to spend way too much time to take what coding I have done and implement for use with the tab script.


Is there any jquery or other scripts as an add-on to my existing menu code that can simply highlight a tab to be current for content that is within the same page?



Link to comment
Share on other sites

That has to be done with JS probably...



I ended up using this one (mostly) along with this "highlite" bit you had on your page.


I thought the tabs were good but I wanted something that will keep the content displayed after you hover over and move away from it.


Here's the results.

Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

  • Create New...