PDA

View Full Version : DDAccordion- Persist State in Safari/Chrome



aelias
03-15-2011, 11:16 PM
1) Script Title: Accordion Content Script (v1.9)

2) Script URL (on DD): http://www.dynamicdrive.com/dynamicindex17/ddaccordion.htm

3) Describe problem:

Hi! I seem to be having a problem getting the persist state to function correctly for this script. I've created a three tier accordion menu, and everything is working great in IE and FF, going to the new page with the menu staying in its expanded state when a second or third tier item is clicked. However, in Safari, the persist state only works some of the time, and at other times the menu just collapses altogether when I go to a subpage. In Chrome, I can't get the persist state to work at all.

I'm using the latest ddaccordion from this site, and have tried a few different versions of jQuery, from 1.3 to 1.5 with no luck. Unfortunately all I can provide is code samples at this time, since this is an internal site.

Does anyone have any ideas?

Thanks in advance! =)



ddaccordion.init({ //top level headers initialization
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: [], //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: "fast", //speed of animation: "fast", "normal", or "slow"
oninit:function(headers, expandedindices){ //custom code to run when headers have initalized
//do nothing
},
onopenclose:function(header, index, state, isclicked){ //custom code to run whenever a header is opened or closed
//do nothing
}
})

ddaccordion.init({ //2nd level headers initialization
headerclass: "subexpandable", //Shared CSS class name of sub headers group that are expandable
contentclass: "subcategoryitems", //Shared CSS class name of sub contents group
collapseprev: true, //Collapse previous content (so only one open at any time)? true/false
defaultexpanded: [], //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: ["closedsubheader", "opensubheader"], //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: "fast", //speed of animation: "fast", "normal", or "slow"
oninit:function(headers, expandedindices){ //custom code to run when headers have initalized
//do nothing
},
onopenclose:function(header, index, state, isclicked){ //custom code to run whenever a header is opened or closed
//do nothing
}
})

ddaccordion.init({ //3rd level headers initialization
headerclass: "subsubexpandable", //Shared CSS class name of sub headers group that are expandable
contentclass: "subsubcategoryitems", //Shared CSS class name of sub contents group
collapseprev: true, //Collapse previous content (so only one open at any time)? true/false
defaultexpanded: [], //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: ["closedsubheader", "opensubheader"], //Two CSS classes to be applied to the header when it's collapsed and expanded, respectively ["class1", "class2"]
togglehtml: ["none", "", ""], //Additional HTML added to the header when it's collapsed and expanded, respectively ["position", "html1", "html2"] (see docs)
animatespeed: "fast", //speed of animation: "fast", "normal", or "slow"
oninit:function(headers, expandedindices){ //custom code to run when headers have initalized
//do nothing
},
onopenclose:function(header, index, state, isclicked){ //custom code to run whenever a header is opened or closed
//do nothing
}
})





<div id="p7TMM_1" class="p7TMM07">
<h2 class="expandable"><a href="#">Special Metals Corporation</a></h2>
<div class="categoryitems">
<h3 class="subexpandable"><a href="#">Special Metals</a></h3>
<div class="subcategoryitems">
<h4><a href="sm-about.html">About Special Metals</a></h4>
<h4 class="subsubexpandable"><a href="#">Special Metal Companies</a></h4>
<div class="subsubcategoryitems">
<ul>
<li><a href="sm-smc-h.html">SMC | Huntington USA</a></li>
<li><a href="sm-smc-nh.html">SMC | New Hartford USA</a></li>
<li><a href="sm-smc-welding.html">Special Metals Welding</a></li>
<li><a href="sm-smc-pacific.html">Special Metals Pacific</a></li>
<li><a href="sm-smc-services.html">Special Metals Services</a></li>
<li><a href="sm-smc-wire.html">Special Metals Wire</a></li>
<li><a href="sm-smc-wiggin.html">Special Metals Wiggin</a></li>
<li><a href="sm-smc-daido.html">Daido-Special Metals</a></li>
<li><a href="sm-incotest.html">IncoTest®</a></li>
<li><a href="sm-tpc.html">Technology Processing Center</a></li>
<li><a href="sm-smc-wasa.html">Western Austrailia Specialty Alloys</a></li>
<li><a href="sm-smc-a1.html">A-1 Wire Tech</a></li>
</ul>
</div>
</div>
<h3 class="subexpandable"><a href="#">Products</a></h3>
<div class="subcategoryitems">
<h4><a href="sm-products.html">Overview</a></h4>
<h4><a href="sm-products-np.html">New Products</a></h4>
<h4><a href="sm-products-ap.html">Alloy Portfolio</a></h4>
<h4 class="subsubexpandable"><a href="#">Industries and Markets</a></h4>
<div class="subsubcategoryitems">
<ul>
<li><a href="sm-products-iam-aero.html">Areospace Engineering</a></li>
<li><a href="sm-products-iam-auto.html">Automotive Engineering</a></li>
<li><a href="sm-products-iam-cp.html">Chemical Processing</a></li>
<li><a href="sm-products-iam-erh.html">Electrical Resistance Heating</a></li>
<li><a href="sm-products-iam-eat.html">Electronics and Telecommunications</a></li>
<li><a href="sm-products-iam-me.html">Marine Engineering</a></li>
<li><a href="sm-products-iam-oage.html">Oil and Gas Extraction</a></li>
<li><a href="sm-products-iam-pp.html">Petrochemical Proccessing</a></li>
<li><a href="sm-products-iam-pcawp.html">Pollution Control and Waste Processing</a></li>
<li><a href="sm-products-iam-pg.html">Power Generation</a></li>
<li><a href="sm-products-iam-tpaht.html">Thermal Processing and Heat Treatment</a></li>
<li><a href="sm-products-iam-welding.html">Welding</a></li>
</ul>
</div>
<h4><a href="sm-products-pfas.html">Product Forms and Sizes</a></h4>
</div>
<h3 class="subexpandable"><a href="#">Services</a></h3>
<div class="subcategoryitems">
<ul>
<li><a href="sm-services.html">Overview</a></li>
<li><a href="sm-incotest.html">IncoTest®</a></li>
<li><a href="sm-tpc.html">Technology Processing Center</a></li>
<li><a href="sm-services-conversion.html">Conversion</a></li>
</ul>
</div>
<h3 class="subexpandable"><a href="#">Sales</a></h3>
<div class="subcategoryitems">
<ul>
<li><a href="sm-sales-americas.html">Americas</a></li>
<li><a href="sm-sales-eatme.html">Europe and The Middle East</a></li>
<li><a href="sm-sales-aaai.html">Australia, Asia and India</a></li>
<li><a href="sm-sales-africa.html">Africa</a></li>
<li><a href="sm-sales-daa.html">Distributors and Agents</a></li>
</ul>
</div>
<h3 class="subexpandable"><a href="#">Surcharges</a></h3>
<div class="subcategoryitems">
<ul>
<li><a href="sm-surcharge-ma.html">Monthly Averages</a></li>
<li><a href="sm-surcharge-mh.html">Metals History</a></li>
</ul>
</div>
<h3 class="subexpandable"><a href="#">Resources</a></h3>
<div class="subcategoryitems">
<h4 class="subsubexpandable"><a href="#">Technical Information</a></h4>
<div class="subsubcategoryitems">
<ul>
<li><a href="sm-resources-accreditations.html">Accreditations</a></li>
<li><a href="PDFs/SMW/msds.pdf">MSDS</a></li>
<li><a href="sm-resources-tp.html">Technical Papers</a></li>
</ul>
</div>
<h4><a href="#">Literature Downloads</a></h4>
</div>
<h3 class="subexpandable"><a href="#">Contact Us</a></h3>
<div class="subcategoryitems">
<ul>
<li><a href="sm-contacts.html">Contacts</a></li>
<li><a href="sm-contacts-employment.html">Employment</a></li>
</ul>
</div>
</div>
<h2 class="expandable"><a href="#">Special Metals Welding</a></h2>
<div class="categoryitems">
<h3><a href="smw-about.html">About Special Metals Welding</a></h3>
<h3><a href="smw-products.html">Products</a></h3>
<h3><a href="smw-materials.html">Technical Material</a></h3>
<h3 class="subexpandable"><a href="smw-contacts.html">Contact Us</a></h3>
<div class="subcategoryitems">
<ul>
<li><a href="smw-inquiry.html">Inquiry Form</a></li>
<li><a href="smw-contacts.html">Contacts</a></li>
</ul>
</div>
<h3><a href="http://www.specialmetalswelding.com/wpcselector/login.aspx" target="_blank">Selector</a></h3>
</div>
</div><!--End of #p7TMM_1 .p7TMM07 -->

pj62
08-22-2011, 03:11 PM
Just wondered if you were able to find a solution as I have a similar problem?

Regards
PJ