Ticket #4493 (closed bug: invalid)
hide( ) method with nested elements (IE7)
|Reported by:||Mark Gajdosik||Owned by:|
|Keywords:||hide nested IE7||Cc:|
Works well in almost everything except for IE7 (and possibly < 7).
<ul id="list" style="display: none;"> <li> <ul id="sublist1" style="display: none;"></ul> <ul id="sublist2" style="display: none;"></ul> </li> </ul>
Now following these steps:
1) $('ul#list, ul#list ul').show() displays whole list with all sublists and possible list items.
2) $('ul#list, ul#list ul').hide() hides everything as expected.
3) $('ul#list').show() displays only top list in FF, Opera, Chrome. In IE7, it displays top list with empty sublists (width and height are kept though).
It appears that hide() hides elements only if they're visible. Since hide() (probably) traverses jQuery object from top elements down to the bottom, it does not hide nested elements because top element is hidden first and nested ones are hidden automatically with it.
I'm not really sure, if this is something related to IE7 or a jQuery bug. Anyway, workaround was to hide elements from the bottom up recursively.