Validating Accordion Content init

[charlieboy]

1) Script Title: Accordion Content script

2) Script URL (on DD): http://www.dynamicdrive.com/dynamici...daccordion.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.