Accordion Content Tab Stuck in Explorer

[annac]

1) Script Title: Accordion Content Script

2) Script URL (on DD): Accordion Content script (v1.9)
http://www.dynamicdrive.com/dynamici...daccordion.htm

3) Describe problem:

The default tab that opens and is highlighted continues to stay highlighted in explorer even when you have switched tabs and other ones are selected. This is not a problem in FF or Safari.

I am not sure what code/css to include. What would be useful?

The page in question is http://www.4culture.org/test/

and I am referring to the bottom tabs "application, workshops..."

[ddadmin]

The tabs aren't powered by DD accordion actually. From what I can tell the only relevant portion of your page that uses this script is upon clicking "Sample Applications"- the two contents inside this tab are.

I'm moving this to the general JavaScript area...

[annac]

I have tried commenting out the different css files and it doesn't seem to make a difference. This makes me think it must be in the script?

ATTACHED SCRIPT

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
	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: false, //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"], //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
	}
})

THERE IS ALSO DDACCORDIAN.JS BUT IT IS LONGER AND I THOUGHT I'D START WITH THESE OTHERS FIRST

SCRIPT AT TOP OF PAGE

<script type="text/javascript">
$(document).ready(function() {
  $("ul.main.tabs").tabs("div.main.panes > div", {tabs: 'a.main'});
 
  $("ul.nested.tabs").tabs("div.nested.panes > div", {tabs: 'a.nested'});
});
</script>

HTML

<!--tabs-->
  <div id="tabsection">
         <!-- tabs + content -->
         <ul class="tabs main">
            <li><a class="main">Application Info</a></li>
            <li><a class="main">Workshops</a></li>
            <li><a class="main">Sample Applications</a></li>
            <li><a class="main">Past Awards</a></li>
            <li><a class="main">Manage Your Award</a></li>
         </ul>
	</div>
<!--PANE 1 ////////////////////////////////////////////////////////////////-->
<div class="panes main">
	<div>
		<div class="panes_nested">
			<div>
                <div class="clear"></div>
<!-- activate accordian 1 -->
                  <script type="text/javascript">
						$(function() {

							$("#accordion_1").tabs("#accordion_1 div.pane", {tabs: 'h2', effect: 'slide'});
						});
				  </script>
               </div>
            </div>
         </div>