Ticket #4721 (closed bug: invalid)
IE: Underlying visible elements Displaying when parent is Hidden
|Reported by:||OOPMan||Owned by:|
Hi, I've recently experienced a very strange issue with a site I'm working on. I'll try to explain the issue as best I can.
The basic page layout is:
-=Top=- Notifications Bar Wizard -=Bottom=-
The notification bar uses jQuery to do a timed fadeout after it is displayed.
One of the pages within the wizard (Pages within wizard are <divs> hidden and displayed as necessary) contains a jQueryUI tab panel.
Moving back/forward within the wizard process causes the notification bar to be hidden.
In IE7, navigating from the wizard page with the tab panel to another wizard page leaves a floating tab panel navigation bar (IE The tab bar with tabs but without any text. Hovering over a tab makes it disappear. The tab bar remains). None of the elements in the tab panel seem to have any absolute position set.
Also in IE7, navigating from one wizard page to another when the notifications panel has been displayed causes the underlying div used by the notifications panel to remain visible in the same fashion as described above (IE Not text content, unresponsive to clicks). This div does use absolute positioning.
The only common thread I could find between the tab panel and the div used by the notifications bar as that both had jQuery attributes set on them.
Possibly this is some kind of bug in the IE rendering engine such that it doesn't properly hide these elements due to their being custom attributes set on them?
In order to fix the issue I had to issue jQuery show/hide commands to the relevant elements as required.