Ajax Tabs Content Tutorial

Dynamic Drive has a great tutorial to help you learn how to create a tabbed section on your website that uses Ajax to update the content.

ajax tabs tutorial

The tutorial and script will show you how to:

  • Fetch and display an external page (from the same domain) inside a container when a tab is clicked on.
  • Add a “default” content inside the container to either be shown while no tabs are selected, or to be associated with a specific tab. The default content is added directly to your page and not fetched via Ajax, for sake of server efficiency.
  • For each tab, you can not only fetch an external page to be shown, but also load external .css and .js files associated with that page if desired.
  • Supports multiple Ajax Tabs Contents on the same page.
  • Fully unobtrusive, search engine friendly script. The tabs are simply list based links. For search engines or browsers with JavaScript disabled, the contents will just load as actual pages (instead of inline via Ajax).
This entry was posted on Monday, January 8th, 2007.
You can leave a comment, or trackback from your own site.

No Comments Yet

You can be the first to comment!

Leave a comment