Tabs
Similar to the accordian the tab control uses jquery to control swapping between tabs. This script will work with any number of tab controls on a page. Currently this script is stored with the fragment that uses it, but can be extracted to a reusable script when necessary.
A tab control needs to have a top level div with .tab-container. Tab headings are stored in a div with .tab-headers and each header is a div with .tab-header containing the tab header content. Similarly the tabs themselves are contained in a div with .tab-container and each tab being a div with .tab containing the tab content.
Example Tab Control
Tab 1
Tab 2
Tab 1 Content
Tab 2 Content
Tab 1
Tab 2
Tab 1 Content
Tab 2 Content
Tab 1
Tab 2
Tab 1 Content
Tab 2 Content