[jQuery] jqModal Overlay not positioned correctly
I'm using Jquery 1.2.1 and the latest version of jqModal. For some reason
the jqmOverlay is not positioned absolute-ly and pushes down content when
viewed in IE7. Works fine in FF (of course).
Here is the relevant goodness:
--JS--
$(document).ready(function(){
$('#quicktip').jqm({overlay: 40, ajax:'tips.php', target:
'.quicktip_content'});
$('#quicktip').jqmShow();
})
--CSS--
.jqmWindow {
display: none;
position: fixed;
top: 17%;
left: 50%;
margin-left: -150px;
width: 300px;
background-color: #EEE;
color: #333;
border: 1px solid black;
padding: 12px;
}
.jqmOverlay { background-color: #000; }
* body .jqmWindow {
position: absolute;
top: expression((document.documentElement.scrollTop ||
document.body.scrollTop) + Math.round(17 *
(document.documentElement.offsetHeight || document.body.clientHeight) / 100)
+ 'px');
}
--HTML--
<div class="jqmWindow" id="quicktip">
<img src="/v4/images/icons/icon_tip.png" width="48" height="48">
<h3>Did you know...</h3>
<p class="quicktip_content"><img src="/v4/images/ajax_spinner.gif">
Loading...
<input type="checkbox" checked="checked"
onchange="setPref('displayLoginTips',this);"> Display tips on login
Close
</div>
<div>
...more content...
</div>
The jqmWindow is a direct descendant of the body tag.
Screenshots:
IE:http://www.jtoo.net/~jgale/screenshots/s1.gif
FF: http://www.jtoo.net/~jgale/screenshots/s2.gif
Thanks in advance,
Jon
--
View this message in context: http://www.nabble.com/jqModal-Overlay-not-positioned-correctly-tf4822901s27240.html#a13798239
Sent from the jQuery General Discussion mailing list archive at Nabble.com.