Posted on

This past weekend I’ve been working on a free Premium WordPress theme for you. I was looking for a good tab navigation script to add to the theme. To allow for better navigation and to add a cool feature to the theme. I found a tons of tab scripts with various frameworks. The list below is some very good tab scripts.

  • Yetii – Yetii is an extremely light weight tab script. It is built with no framework and is very easy to install. You can even have a tab nested within another tab.
  • Advanced Tabs – Advanced Tabs is an EXT JS plugin that allows you to add tabs, tab resizing, and tab scrolling. The code has some very cool features.
    Advanced Tabs
  • Sliding Tabs – Sliding Tabs is a mootools 1.11 plugin that shows the content slide over when you click on the tab or arrow button. It is a really neat effect.
    Scrolling Tabs
  • DOMTab – DOMtab is JavaScript that turns a list into a tabular content. It is very lightweight and is easy to implement. It degrades very nicely if your visitor doesn’t allow javascript. DOMtab does have some problems with divs inside the tab content but it is a great script.
  • Coda-Slider – Coda-Slider is a jQuery Plugin that slides the content over when you click on the tab or the arrow button. It is a cool effect and is fairly easy to install on your site.
  • Scriptaculous Tabs – Scriptaculous tabs requires the use of obviously scriptaculous and prototype. The script allows you to create interactive tabs for your site and the content box stretches as the more content you put into it.
    Scriptaculous Tabs
  • Ajax Tabs – Ajax Tabs is an easy to implement Dynamic CSS Tab. The user can add and remove tabs (and content) without refreshing the page. It is a very cool concept but just needs some work to make it even better.
    Ajax Tabs
  • MooTabs – MooTabs is a tiny(3kb) class for MooTools. It’s main purpose is to help out with the creation of simple tab navigation. The newest addition to MooTabs is that it now retrieves the content via ajax. It is very easy to install and if you have MooTools than I suggest you check it out.
  • TabView – TabView is built on Yahoo! UI library and is a good Tab navigation script. It is pretty easy to implement and will allow you to create the same effect that is on Yahoo! homepage.
  • JavaScript Tabifier – JavaScript Tabifier converts your lists into a tabbed navigation. It is built with no framework and gracefully degrades if JavaScript is not present. With JavaScript Tabifier you can have a tab within a tab and you can use a cookie to remember which tab was selected so it remains selected when you return to the page.
    JavaScript Tabifier

If you have any you would like to add or have used some of the above scripts please comment below.

Tags: , , , , , , ,

24 thoughts on “List of JavaScript Tab Navigation Scripts

  1. Pingback: AJAX coding school » Blog Archive » AJAX News [2008-04-01 05:02:30]

  2. Pingback: roScripts - Webmaster resources and websites

  3. Pingback: diarioTHC | Diferentes interfaces con navegación en “tabs”

  4. Pingback: links for 2008-04-02 | iKeif

  5. I am not such a huge fan of these techniques with an eye on SEO. I prefer using php so every page is really a special page in stat of loading the pages this way with javascript. How does everybody else think about this?

  6. Edwin: I don’t know about all of these scripts, but the one I created called “Sliding Tabs” does not use Ajax to load any data. All the data shown is in the html of the page, and is just selectively hidden and shown as needed. This shouldn’t affect search engines at all.

  7. @Edwin – When originally writing this list I wasn’t looking for SEO, I was mainly looking at the user interaction. I really think that user interaction is much more important than SEO. But they do go hand in hand. I mean without visitors then no user interaction.

  8. Pingback: Valontuoja » Blog Archive » Kaoottinen linkkidumppi

  9. I have page with four simple tab navigation and all the tabs are forms. So if I submit any form it redirects to first tab but i want to keep it to the same form how do i do it. Please any has solution or any suggestion on it.

  10. nice site, WHAT A CRAZY WORLD WE LIVE IN please use your position of influence to spread the truth about the Olympic 2012 false-flag terror attacks (huge LIES like 9/11 and 7/7) due to take place in london because US/UK/EU/Isreal is running out of excuses to attack Iran/Syria. Thanks mate. Appreciate it =)

  11. Siller’s family created the Foundation’sONSet the best of a $187check out approximately $92 and potential consumers will convert absent. While you are it true which the easy gladness in a bestAfter interviewing gurus that counsel

Leave a Reply

Your email address will not be published. Required fields are marked *