Validating Accordion Content init

[charlieboy]

1) Script Title: Accordion Content script

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

3) Describe problem: Validating the ddaccordion.init

Hi there, I'm using this to display a menu and have implemented the plus and minus graphics in the 'statusicon' class placed within the togglehtml line of the init as follows...


<script type="text/javascript">

ddaccordion.init({
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" or "mouseover
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' alt='open icon' />", "<img src='images/minus.gif' class='statusicon' alt='close icon' />"], //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"
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
if(state == "block"){
header.id = "active";
} else {
header.id = "";
} }
})


</script>

The problem I'm having is that when I try and validate the page, the only two errors I get are that it doesn't allow an IMG element in this area. The page is XHTML Transitional and UTF-8.

I would be grateful for any advice to help resolve this issue.
Many thanks in advance.
Paul

[ddadmin]

It's most likely referring to the IMG tag that's specified in your inialization code above, thinking that line is actually markup when it's just a variable assignment:


togglehtml: ["suffix", "<img src='images/plus.gif' class='statusicon' alt='open icon' />", "<img src='images/minus.gif' class='statusicon' alt='close icon' />"], //Additional HTML added to the header when it's collapsed and expanded, respectively ["position", "html1", "html2"] (see docs)

You can try escaping the opening "<" and closing ">" tags above and use their HTML entities equivalent, though I'm not sure if the image will still be shown as a result.