[jQuery] Strange slideDown problem with nested lists
If I have a nested list like:
<span style="font-family: courier new,monospace;">1</span><br style="font-family: courier new,monospace;"><span style="font-family: courier new,monospace;">|_ 1.1</span><br style="font-family: courier new,monospace;">
<span style="font-family: courier new,monospace;"> |_ 1.1.1</span><br style="font-family: courier new,monospace;"><span style="font-family: courier new,monospace;">|_ 1.2</span><br style="font-family: courier new,monospace;">
<span style="font-family: courier new,monospace;">2</span><br style="font-family: courier new,monospace;"><span style="font-family: courier new,monospace;">3</span><br clear="all">
I'm doing this:
<span style="font-family: courier new,monospace;">
$(document).ready(function() {</span><br style="font-family: courier new,monospace;"><span style="font-family: courier new,monospace;"> $("dl li:contains('ul')").hide();</span><br style="font-family: courier new,monospace;">
<span style="font-family: courier new,monospace;"> $("dl li").click(function(e) {</span><br style="font-family: courier new,monospace;"><span style="font-family: courier new,monospace;"> y = $(this).next("li:contains('ul')");
</span><br style="font-family: courier new,monospace;"><span style="font-family: courier new,monospace;"> if($(y).is(":hidden")) $(y).show("fast");</span><br style="font-family: courier new,monospace;">
<span style="font-family: courier new,monospace;"> else $(y).hide("fast")</span><br style="font-family: courier new,monospace;"><span style="font-family: courier new,monospace;"> e.stopPropagation();</span>
<br style="font-family: courier new,monospace;"><span style="font-family: courier new,monospace;"> });</span><br style="font-family: courier new,monospace;"><span style="font-family: courier new,monospace;">});</span>
My markup looks like this:
<span style="font-family: courier new,monospace;"><ul></span><br style="font-family: courier new,monospace;"><span style="font-family: courier new,monospace;"> <li id="1">1</li>
</span><br style="font-family: courier new,monospace;"><span style="font-family: courier new,monospace;"> <li id="1."><ul></span><br style="font-family: courier new,monospace;"><span style="font-family: courier new,monospace;">
<li id="1.1">1.1</li></span><br style="font-family: courier new,monospace;"><span style="font-family: courier new,monospace;"> <li id="1.1."><ul></span><br style="font-family: courier new,monospace;">
<span style="font-family: courier new,monospace;"> <li id="1.1.1">1.1.1</li></span><br style="font-family: courier new,monospace;"><span style="font-family: courier new,monospace;"> </ul></li>
</span><br style="font-family: courier new,monospace;"><span style="font-family: courier new,monospace;"> <li id="1.2">1.2</li></span><br style="font-family: courier new,monospace;"><span style="font-family: courier new,monospace;">
</ul></li></span><br style="font-family: courier new,monospace;"><span style="font-family: courier new,monospace;"> <li id="2">2</li></span><br style="font-family: courier new,monospace;">
<span style="font-family: courier new,monospace;"> <li id="3">3</li></span><br style="font-family: courier new,monospace;"><span style="font-family: courier new,monospace;"> <li id="4">4</li>
</span><br style="font-family: courier new,monospace;"><span style="font-family: courier new,monospace;"></ul></span>
I'm enclosing ul's in li's and using nextSibling so it will validate (the HTML spec does not allow a UL element directly under another UL element). The problem I had was replicated in the nested list code used by
<a href="http://be.twixt.us/jquery/treeView.php">http://be.twixt.us/jquery/treeView.php</a> so it's not a markup-related issue.
The problem is as follows:
I expand the top level of "1", then expand its children all the way down. I then close up the top-level element and reopen it. When I do, the height of the "1." li doesn't change when I try to expand tree levels. It gets stuck on whatever the height was when I closed the original top-level.
I'm not 100% sure what's causing the problem, but I'm pretty sure it has something to do with the new implementation of css and curCSS, and how it stores the state of dimensional information.
--
Yehuda Katz
Web Developer
(ph) 718.877.1325
(fax) 718.686.4288
_______________________________________________
jQuery mailing list
discuss@jquery.com
http://jquery.com/discuss/