Just for a quick and dirty example here on how to use it:
Include the necessary js files:
<script type="text/javascript"
src="js/prototype.lite.js"></script>
<script type="text/javascript" src="js/moo.fx.js"></script>
<script type="text/javascript" src="js/moo.fx.pack.js"></script>
<script type="text/javascript" src="js/niftycube.js"></script>
Stick something like this in a javascript:
<script type="text/javascript">
window.onload = function(){
//we define two arrays, containing our toggles and divs.
var myDivs =
document.getElementsByClassName('stretcher');
var myLinks =
document.getElementsByClassName('stretchtoggle');
//then we create the effect.
myAccordion = new fx.Accordion(myLinks, myDivs,
{opacity: true});
// I stuck nifty corners into the mix, they work
together and look perfect
Nifty("li.stretchtoggle h3","top");
Nifty("div.stretcher","bottom");
Nifty("td.navCell","");
Nifty("td.searchResults","");
Nifty("div#stopoff","big");
Nifty("div#headingRow","transparent");
// Show the 1st accordian as open if you want too by
default
myAccordion.showThisHideOpen(myDivs[0]);
</script>
Then create your data like this:
<ul>
<li class="stretchtoggle">They would click on this text to open
it
<div class="stretcher">
This would be opened after they click
</div>
</li>
<li class="stretchtoggle">They would click on this text to open
it (2nd link)
<div class="stretcher">
This would be opened after they click
</div>
</li>
</ul>
Have fun,
Chris
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~|
Introducing the Fusion Authority Quarterly Update. 80 pages of hard-hitting,
up-to-date ColdFusion information by your peers, delivered to your door four
times a year.
http://www.fusionauthority.com/quarterly
Archive:
http://www.houseoffusion.com/groups/CF-Talk/message.cfm/messageid:255212
Subscription: http://www.houseoffusion.com/groups/CF-Talk/subscribe.cfm
Unsubscribe: http://www.houseoffusion.com/cf_lists/unsubscribe.cfm?user=89.70.4