Apple style Accordion Menu Trembling in IE

[praveen_tis]

1) Script Title: Apple style Accordion Menu

2) Script URL (on DD): http://www.dynamicdrive.com/dynamici...menu-apple.htm

3) Describe problem: In IE the Accordion is flashing the below menu contents when the above menus or expanded or closed. IT is working smoothly in all other browsers. Can ony one point me out in the right direction.

The below is the sample HTML code of it.


<div class="silverheader" style="border-left-style: none;">
<a>
<table cellspacing="0" cellpadding="0" border="0">
<tr>
<td class="greenPannelTopFont" width="100%">
QUICK LINKS</td>
</tr>
</table>
</a>
</div>
<div class="submenu" id="whiteBottomImage12">
<div class="whiteBottomImage">
<table>
<tr>
<td>
<table cellspacing="0" cellpadding="0" border="0" >
<tr>
<td class="greenPannelMiddFont">
<img height="9" border="0" width="6" src="images/red_arrow.gif" /></td>
<td class="greenPannelMiddFont3">
<a href="#">intelliConnect intelliConnect </a>
</td>
</tr>
<tr>
<td class="greenPannelMiddFont">
<img height="9" border="0" width="6" src="images/red_arrow.gif" /></td>
<td class="greenPannelMiddFont3">
<a href="#">2010 Books</a></td>
</tr>
<tr>
<td class="greenPannelMiddFont">
<img height="9" border="0" width="6" src="images/red_arrow.gif" /></td>
<td class="greenPannelMiddFont3">
<a href="#">Trainig</a></td>
</tr>
<tr>
<td class="greenPannelMiddFont">
<img height="9" border="0" width="6" src="images/red_arrow.gif" /></td>
<td class="greenPannelMiddFont3">
<a href="#">Trainig</a></td>
</tr>
<tr>
<td class="greenPannelMiddFont">
<img height="9" border="0" width="6" src="images/red_arrow.gif" /></td>
<td class="greenPannelMiddFont3">
<a href="#">Trainig</a></td>
</tr>
<tr>
<td class="greenPannelMiddFont">
<img height="9" border="0" width="6" src="images/red_arrow.gif" /></td>
<td class="greenPannelMiddFont3">
<a href="#">intelliConnect intelliConnect </a>
</td>
</tr>
<tr>
<td class="greenPannelMiddFont">
<img height="9" border="0" width="6" src="images/red_arrow.gif" /></td>
<td class="greenPannelMiddFont3">
<a href="#">2010 Books</a></td>
</tr>
</table>
</td>
</tr>
</table>
</div>
</div>
<div>
<img border="0" src="images/greenPannel_seperator.gif" /></div>

The same HTML Structure is followed for all other accordion menu items.

I have not changed any thing in the JS files.

This is very urgent for me. Any help on this is appreciated.

Thanks,
Praveen

[Nile]

Do you have a valid doc type? I'm pretty sure I've heard DDAdmin say that this could be the problem, but I'm not sure.

[praveen_tis]

The doc is valid one and I have all the necessary tags in it.
Can any tell me how to make it work without the animation. Just Straight forward expand and collapse.

Thanks,
Praveen

[ddadmin]

Please post a link to the page on your site that contains the problematic script so we can check it out.

With regards to:

Can any tell me how to make it work without the animation. Just Straight forward expand and collapse.

One way to simulate this is to set the animation duration to 0, so it happens almost instantly. In your config code in the HEAD section of the page, try changing the line in red below (to 0):

["position", "html1", "html2"] (see docs)
	animatespeed: 0, //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
	}
})