Modal Dialog / Overlay Inconsistency

Modal Dialog / Overlay Inconsistency


I have an application that displays an org chart of employees. On
each employee node I have a button to open that employee's profile. I
am using jQuery UI 1.7.2 modal dialog for the profile window.
When I click the open profile button on an employee on the BOTTOM half
of the window, the dialog appears and the modal overlay is
transparent. But when I click the open profile button on an employee
on the TOP half of the window, the modal overlay is opaque, and my
chart disappears completely. Note the chart is pannable and there are
horizontal and vertical scrollbars before opening the dialog. When
the opaque overlay is shown, the scrollbars also disappear.
If I then MOVE the dialog while the opaque overlay is displayed, the
overlay becomes transparent. So, something about moving the dialog
causes the overlay to be redrawn correctly.
I can't seem to figure out why this would be or what workarounds there
might be.