The Accordion flavors are : horizontal | tabs | two columns.

This script looks for all h3 elements with class name “atStart” and all div elements with class name “atStart” to create the accordion effect. The class name doesn’t have to be “atStart”, it can be whatever you want it to be. It doesn’t even have to be an h3. You could use an anchor tag or a list item.
CSS

JavaScript does not affect the look of the accordion, CSS does. I’m going to say it one more time because it’s the most asked question that I get so, JavaScript does not affect the look of the accordion, CSS does.

You accordion is made up of at least 2 elements. It does not matter where those elements are on the page. They don’t have to come directly after the other. So, if you want to create a tab like accordion the place all the accordion togglers together and float them left, then after that put all the elements that contain the accordion content.

Demo: http://www.nyokiglitter.com/tutorials/tabs.html

Download: http://www.nyokiglitter.com/file_download/3

Source: http://www.nyokiglitter.com/tutorials/tabs.html

Related Listings:

1. Drag and Drop Accordion Script The Accordion widget and its InfoPanel are components that can...
2. Accordion Plugin using Jquery Script This plugin is now part of jQuery UI and this...
3. jQuery hover accordion Script This is yet another accordion script, except you don’t have...
4. Completely Flexible Accordion Accordion is a plugin for RapidWeaver. It builds a dynamic...
5. Free dhtmlx Accordion, Easy to use JavaScript Accordion with Ajax Support dhtmlx Accordion allows you to organize your content in a...

Do you like this post?

Email: