Building a tab navigation using jQuery
Any site is incomplete without navigation links. Tabs are a good user interface approach to bring navigation to the site. Navigation links can easily be designed to look like tabs, through CSS. There are many tab implementations in jQuery. In this recipe, we'll look into how to integrate the jQuery UI Tabs plugin easily.
Getting ready
We'll require the jQuery UI from http://jqueryui.com/, with the Tabs component.
How to do it...
The jQuery UI Tabs plugin makes use of accessible markup standards. As soon as we use predefined HTML markup, and hook it to jQuery UI Tabs with a selector, we're done!
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <link rel="stylesheet" type="text/css" href="themes/base/jquery.ui.all.css" /> <script type="text/javascript" src="js/jquery.js"></script> <script type="text...