Creating Mootools accordion or simple slider/toggler
From Joomla! Documentation
Revision as of 19:39, 23 May 2013 by Tom Hutchison (talk | contribs) (Hutchy68 moved page Creating Mootools accordion or simple slider/toggler to J2.5:Creating Mootools accordion or simple slider/toggler: namespacing for version)
The "J2.5" namespace is a namespace scheduled to be archived. This page contains information for a Joomla! version which is no longer supported. It exists only as a historical reference, it will not be improved and its content may be incomplete and/or contain broken links.
This page is tagged because it NEEDS REVIEW. You can help the Joomla! Documentation Wiki by contributing to it.
More pages that need help similar to this one are here. NOTE-If you feel the need is satistified, please remove this notice.
Simple example to create a simple accordion. Can also be used to make a simple slide-toggler (just use 1 link).
In this example all the accordions (slider) are closed by default.
The php code (e.g. inside template):
//Add Slide/toggle behavior
JHTML::_('behavior.framework',true);
$this->document->addScriptDeclaration('
window.addEvent("domready", function( ){
navAcc = new Accordion( $$( ".accordion .accT" ), $$( ".accordion .accE" ), {display: -1, alwaysHide: true} );
});
Your html should look like this:
<div class="accordion">
<a class="accT">Link 1</a>
<div class="accE">Container 1</div>
<a class="accT">Link 1</a>
<div class="accE">Container 2</div>
<a class="accT">Link 1</a>
<div class="accE">Container 3</div>
</div>