Ajax Tabs
Read more and download "Ajax Tabs"
This workshop we will be building a tabbed content browser that’s Ajax powered. When ever a user clicks a tab the Ajax will communicate with the server and send back the appropriate data for that tab. We will start this workshop off with the XHTML and CSS for the tabbed content browser. We will need 3 main IDs (one for the container, one for the content area and one for the loading status) and 1 class (for the tabs).
The first ID #container will hold the tabs as well as the content area, we only give this a width which everything inside can inherit. The following class .tabs is going to style our tabs, most of the styling we have is mostly for looks an important property is the float:left. The float:left makes the tabs so they are on the same horizontally aligned, this can also be done with using display:inline but with a little more tweaking. We also gave it a property of cursor:pointer so when the user mousses over the tab that it has the look and feel of a button. Finally we have the ID #content.
Web 2.0 Box Generator