Flea
03-02-2008, 03:02 AM
1) Script Title: Accordion Menu script
2) Script URL (on DD): http://www.dynamicdrive.com/dynamicindex17/ddaccordionmenu.htm
3) Describe problem: http://screencast.com/t/0KSgDOrTfKb
The first expandable UL always stays open, on page refresh's, I'd like it to stay closed upon openning new pages, How would I do this?
<script type="text/javascript">
ddaccordion.init({
headerclass: "expandable", //Shared CSS class name of headers group that are expandable
contentclass: "categoryitems", //Shared CSS class name of contents group
collapseprev: true, //Collapse previous content (so only one open at any time)? true/false
defaultexpanded: [0], //index of content(s) open by default [index1, index2, etc]. [] denotes no content
animatedefault: false, //Should contents open by default be animated into view?
persiststate: true, //persist state of opened contents within browser session?
toggleclass: ["", "openheader"], //Two CSS classes to be applied to the header when it's collapsed and expanded, respectively ["class1", "class2"]
togglehtml: ["prefix", "", ""], //Additional HTML added to the header when it's collapsed and expanded, respectively ["position", "html1", "html2"] (see docs)
animatespeed: "normal" //speed of animation: "fast", "normal", or "slow"
})
</script>
<!--Catagory Icons / Links -->
<div class="arrowlistmenu" width="150">
<h3 align="center" class="menuheader"><div style="padding-top:11px;" class="menu_font"><a href="index.php?_a=viewCat&catId=1" class="menu_font">Premature</a></div></h3>
<h3 align="center" class="menuheader"><div style="padding-top:11px;" class="menu_font"><a href="index.php?_a=viewCat&catId=2" class="menu_font">Layette</a></div></h3>
<h3 align="center" class="menuheader expandable"><div style="padding-top:11px;">Newborn</div></h3>
<ul class="categoryitems">
<li><a href="index.php?_a=viewCat&catId=18">3 Months</a></li>
<li><a href="index.php?_a=viewCat&catId=19">6 Months</a></li>
<li><a href="index.php?_a=viewCat&catId=20">9 Months</a></li>
</ul>
<h3 align="center" class="menuheader expandable"><div style="padding-top:11px;">Infant</div></h3>
<ul class="categoryitems">
<li><a href="index.php?_a=viewCat&catId=21">12 Months</a></li>
<li><a href="index.php?_a=viewCat&catId=22">18 Months</a></li>
<li><a href="index.php?_a=viewCat&catId=23">24 Months</a></li>
</ul>
<h3 align="center" class="menuheader expandable"><div style="padding-top:11px;">Toddlers</div></h3>
<ul class="categoryitems">
<li><a href="index.php?_a=viewCat&catId=24">2T</a></li>
<li><a href="index.php?_a=viewCat&catId=25">3T</a></li>
<li><a href="index.php?_a=viewCat&catId=26">4T</a></li>
</ul>
<h3 align="center" class="menuheader expandable"><div style="padding-top:11px;">Kids</div></h3>
<ul class="categoryitems">
<li><a href="index.php?_a=viewCat&catId=27">Size 1</a></li>
<li><a href="index.php?_a=viewCat&catId=28">Size 2</a></li>
<li><a href="index.php?_a=viewCat&catId=29">Size 3</a></li>
<li><a href="index.php?_a=viewCat&catId=30">Size 4</a></li>
</ul>
<h3 align="center" class="menuheader"><div style="padding-top:11px;" class="menu_font"><a href="index.php?_a=viewCat&catId=7" class="menu_font">Accessories</a></div></h3>
<h3 align="center" class="menuheader"><div style="padding-top:11px;" class="menu_font"><a href="index.php?_a=viewCat&catId=8" class="menu_font">Bedding</a></div></h3>
<h3 align="center" class="menuheader"><div style="padding-top:11px;" class="menu_font"><a href="index.php?_a=viewCat&catId=9" class="menu_font">Bath</a></div></h3>
<h3 align="center" class="menuheader"><div style="padding-top:11px;" class="menu_font"><a href="index.php?_a=viewCat&catId=10" class="menu_font">Toys</a></div></h3>
<h3 align="center" class="menuheader"><div style="padding-top:11px;" class="menu_font"><a href="index.php?_a=viewCat&catId=11" class="menu_font">Car Seats</a></div></h3>
<h3 align="center" class="menuheader"><div style="padding-top:11px;" class="menu_font"><a href="index.php?_a=viewCat&catId=12" class="menu_font">Strollers</a></div></h3>
</div>
</div>
<!--Catagory Icons / Links ENDS-->
2) Script URL (on DD): http://www.dynamicdrive.com/dynamicindex17/ddaccordionmenu.htm
3) Describe problem: http://screencast.com/t/0KSgDOrTfKb
The first expandable UL always stays open, on page refresh's, I'd like it to stay closed upon openning new pages, How would I do this?
<script type="text/javascript">
ddaccordion.init({
headerclass: "expandable", //Shared CSS class name of headers group that are expandable
contentclass: "categoryitems", //Shared CSS class name of contents group
collapseprev: true, //Collapse previous content (so only one open at any time)? true/false
defaultexpanded: [0], //index of content(s) open by default [index1, index2, etc]. [] denotes no content
animatedefault: false, //Should contents open by default be animated into view?
persiststate: true, //persist state of opened contents within browser session?
toggleclass: ["", "openheader"], //Two CSS classes to be applied to the header when it's collapsed and expanded, respectively ["class1", "class2"]
togglehtml: ["prefix", "", ""], //Additional HTML added to the header when it's collapsed and expanded, respectively ["position", "html1", "html2"] (see docs)
animatespeed: "normal" //speed of animation: "fast", "normal", or "slow"
})
</script>
<!--Catagory Icons / Links -->
<div class="arrowlistmenu" width="150">
<h3 align="center" class="menuheader"><div style="padding-top:11px;" class="menu_font"><a href="index.php?_a=viewCat&catId=1" class="menu_font">Premature</a></div></h3>
<h3 align="center" class="menuheader"><div style="padding-top:11px;" class="menu_font"><a href="index.php?_a=viewCat&catId=2" class="menu_font">Layette</a></div></h3>
<h3 align="center" class="menuheader expandable"><div style="padding-top:11px;">Newborn</div></h3>
<ul class="categoryitems">
<li><a href="index.php?_a=viewCat&catId=18">3 Months</a></li>
<li><a href="index.php?_a=viewCat&catId=19">6 Months</a></li>
<li><a href="index.php?_a=viewCat&catId=20">9 Months</a></li>
</ul>
<h3 align="center" class="menuheader expandable"><div style="padding-top:11px;">Infant</div></h3>
<ul class="categoryitems">
<li><a href="index.php?_a=viewCat&catId=21">12 Months</a></li>
<li><a href="index.php?_a=viewCat&catId=22">18 Months</a></li>
<li><a href="index.php?_a=viewCat&catId=23">24 Months</a></li>
</ul>
<h3 align="center" class="menuheader expandable"><div style="padding-top:11px;">Toddlers</div></h3>
<ul class="categoryitems">
<li><a href="index.php?_a=viewCat&catId=24">2T</a></li>
<li><a href="index.php?_a=viewCat&catId=25">3T</a></li>
<li><a href="index.php?_a=viewCat&catId=26">4T</a></li>
</ul>
<h3 align="center" class="menuheader expandable"><div style="padding-top:11px;">Kids</div></h3>
<ul class="categoryitems">
<li><a href="index.php?_a=viewCat&catId=27">Size 1</a></li>
<li><a href="index.php?_a=viewCat&catId=28">Size 2</a></li>
<li><a href="index.php?_a=viewCat&catId=29">Size 3</a></li>
<li><a href="index.php?_a=viewCat&catId=30">Size 4</a></li>
</ul>
<h3 align="center" class="menuheader"><div style="padding-top:11px;" class="menu_font"><a href="index.php?_a=viewCat&catId=7" class="menu_font">Accessories</a></div></h3>
<h3 align="center" class="menuheader"><div style="padding-top:11px;" class="menu_font"><a href="index.php?_a=viewCat&catId=8" class="menu_font">Bedding</a></div></h3>
<h3 align="center" class="menuheader"><div style="padding-top:11px;" class="menu_font"><a href="index.php?_a=viewCat&catId=9" class="menu_font">Bath</a></div></h3>
<h3 align="center" class="menuheader"><div style="padding-top:11px;" class="menu_font"><a href="index.php?_a=viewCat&catId=10" class="menu_font">Toys</a></div></h3>
<h3 align="center" class="menuheader"><div style="padding-top:11px;" class="menu_font"><a href="index.php?_a=viewCat&catId=11" class="menu_font">Car Seats</a></div></h3>
<h3 align="center" class="menuheader"><div style="padding-top:11px;" class="menu_font"><a href="index.php?_a=viewCat&catId=12" class="menu_font">Strollers</a></div></h3>
</div>
</div>
<!--Catagory Icons / Links ENDS-->