IE6 Select Ovelapping Dynamic popup Div Solution

Tuesday, January 19, 2010 by Aslam - The Alexendra
Hi All,
Many times i found the problem with Dynamic popup on js event showing on page in IE6. If you have any Select element on the page, your div will not come on top of this Select. So here is the IFrame hack for this problem:-

// Outer Div -->
<div id="popupParent" style="background-color:#fefdb9;
width:346px;
position:absolute;
display:none;
top:0px;
overflow:hidden;
z-index:20;
">

// IFRAME HACK -
<iframe id="menu4iframe" src="javascript:'';" marginwidth="0" marginheight="0" align="bottom" scrolling="no" frameborder="0" style="position:absolute; left:0; top:0px; display:block; filter:alpha(opacity=0);height:300px"></iframe>

// INNER DIV FOR YOUR COntents -->
<div id="popup" style="border:thin solid #ffa500;padding:2px;overflow:hidden;background-color:#fefdb9;"/>
</div>

On any js event you just need to set your inner html in 'popup' and set the display property of 'popupParent' div.
Thats It.

Thanks
Posted in | 0 Comments »

0 comments:

Post a Comment