View Full Version : Accordion Menu script not working with Dreamweaver Templates

10-04-2010, 06:56 PM
1) Script Title: Accordion Menu script (v1.7.1)

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

3) Describe problem: I have this working on my index.html page at http://www.sbac.edu/~seccurr/new

The problem is with other pages in the site that are dependent on a template.
Any page that uses a template loads with unexpected behavior.
There are two templates working. One at http://www.sbac.edu/~seccurr/new/elemStuSvcs.html
and one at http://www.sbac.edu/~seccurr/new/aboutelem.html

Both templates have nearly the same issue. The minus sign does not display when it is working, but it is unpredictable. Sometimes when I try to expand a menu, it flickers and won't expand, esp. if the page is refreshed.

I really think the problem lies in how Dreamweaver's templates are used.

You can analyze the templates at http://www.sbac.edu/~seccurr/new/Templates/pagestemplate.dwt and pagetemplate.dwt

Behavior is most evident using IE8. Firefox seems to work better, but not perfectly.

10-05-2010, 03:44 AM
Much of your problems is due to the fact that you've included the reference files of the Accordion script twice on your page. For example, if you look at your page (http://www.sbac.edu/~seccurr/new/elemStuSvcs.html), you'll see the following code chunk repeated twice:

<link href="Styles/style1.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<script type="text/javascript" src="ddaccordion.js">

* Accordion Content script- (c) Dynamic Drive DHTML code library (www.dynamicdrive.com)
* Visit http://www.dynamicDrive.com for hundreds of DHTML scripts
* This notice must stay intact for legal use

<script type="text/javascript">

headerclass: "submenuheader", //Shared CSS class name of headers group
contentclass: "submenu", //Shared CSS class name of contents group
revealtype: "click", //Reveal content when user clicks or onmouseover the header? Valid value: "click", "clickgo", or "mouseover"
mouseoverdelay: 200, //if revealtype="mouseover", set delay in milliseconds before header expands onMouseover
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
onemustopen: false, //Specify whether at least one header should be open always (so never all headers closed)
animatedefault: false, //Should contents open by default be animated into view?
persiststate: true, //persist state of opened contents within browser session?
toggleclass: ["", ""], //Two CSS classes to be applied to the header when it's collapsed and expanded, respectively ["class1", "class2"]
togglehtml: ["suffix", "<img src='images/plus.gif' class='statusicon' />", "<img src='images/minus.gif' class='statusicon' />"], //Additional HTML added to the header when it's collapsed and expanded, respectively ["position", "html1", "html2"] (see docs)
animatespeed: "fast", //speed of animation: integer in milliseconds (ie: 200), or keywords "fast", "normal", or "slow"
oninit:function(headers, expandedindices){ //custom code to run when headers have initalized
//do nothing
onopenclose:function(header, index, state, isuseractivated){ //custom code to run whenever a header is opened or closed
//do nothing


The later code block on the page needs to be removed.

10-05-2010, 02:35 PM
That makes perfect sense. I kept using the same template and the problem kept following it.

I don't know how the code was repeated in the first place, but I am so thankful that you found it!

The nav bar works exactly as designed.

Thank you very much!!