Accordion panel "blank" in IE6; shows on accordion tab hover

Question

this is a weird one. I'm using Spry1.5 accordion with 3
panels. The accordion panels themselves each contain a form and
some tables and whatnot. the markup appears to be valid.
Everything works fine in firefox. but in IE 6, i get this
behavior: the panels open properly and all that, but the div itself
is "blank", meaning none of the content shows up. However, when I
hover over any of the panel tabs, the content appears.
I'm at a loss. Has anyone else ever experienced anything like
this and, if so, how do you work around it?
It's hard for me to post code because this is in an internal
site, and also there's all kind of other js and css being brought
into the page. i'm trying to extract all of it so that i can put it
online somewhere, but it's taking me some time.
thanks so much.
Marc Esher

Answer 1

It seems that this behavior can be caused by multiple
factors. Several of the solutions suggested by others didn't help
me. In my case, I discovered that the problem could be solved by
turning off panel animation. In order to keep the animation in
non-MS browsers, I trap for IE and append the proper code if
necessary,in PHP:
(This code also uses the $accOpen variable (set elsewhere) to
specify which panel to open when the page loads. Obviously, you can
remove this if you don't need it.)
quote:
// Trap for Internet Explorer, because animation screws up
the display
$ua = $_SERVER['HTTP_USER_AGENT'];
$ie = "";
if(preg_match("/MSIE/", strtoupper($ua)))
$ie = ", enableAnimation: false";
?>
<script type="text/javascript">
<!--
var Accordion1 = new Spry.Widget.Accordion("Accordion1",
{defaultPanel: <?= $accOpen ?><?= $ie ?>});
//-->
</script>
I hope this helps.
Regards,
Bill Krauss