According Loading
According Loading
I'm using JQuery 1.3.2 with UI 1.7.2 am seeing an undesirable effect
with the accordion loading. I've tested Firefox 3.5.2 and IE8
When it first loads all of the menus are open and then quickly closed
causing a flash affect and the page re-sizes because the menu gets
much smaller.
Here's a snippet from my page:
<script type="text/javascript">$(function() { $("#menu").accordion
({ event: "mouseover", header: "dt", autoHeight: false, active:
".open" });});</script>
<div id="menu">
<dl class="first"><dt>Header</dt></dl>
<dl>
<dt class=""><a href="menu1.html">Menu 1</a></dt>
<dd>
<ul>
<li ><a href="item1.html">Item 1</a></li>
<li ><a href="item2.html">Item 2</a></li>
<li ><a href="item3.html">Item 3</a></li>
</ul>
</dd>
</dl>
<dl>
<dt class="open"><a href="menu2.html">Menu 2</a></dt>
<dd>
<ul>
<li ><a href="item1.html">Item 1</a></li>
<li ><a href="item2.html">Item 2</a></li>
<li ><a href="item3.html">Item 3</a></li>
</ul>
</dd>
</dl>
</div>
If I add this CSS: #menu dd { display: none; } the problem is
corrected, but the accordion stops working completely.
If I add a class to each <dd>, such as <dd class="hidden"> and then
this CSS: .hidden {display:none;}, this solves the problem, but the
one that should be open when the page loads (as designated by <dt
class="open">) isn't loaded open. I can do a hack such that the server
side code doesn't add the hidden class to the one that should be
opened, but that feels like an ugly hack.
Wondering how to solve this.
Thanks,
-peter