I have a jQuery Tools Modal Overlay on my website, and it works perfectly fine in both Chrome and Firefox... however, when I view the page in IE8, the black background mask appears on top of the dialog DIV... in addition, the div appears at the bottom of the page where the actual code is as opposed to centered on the screen.
In addition, I'm also getting one of those "Error on Line 1 Char 6" Errors", and I can't seem to debug this bad boy. I get a similar error in Chrome "Uncaught SyntaxError: Unexpected token )" but it does not interfere with the modal. I have a feeling its unrelated, but with IE, you never know.
Any assistance would be so greatly appreciated!!
JS File
var api;
showDiv('partmodal');
function showDiv(v){
if (!document.getElementById(v)) return;
if (api)
if (api.isOpened) api.close();
api=$('#'+v).overlay({
mask: {color: '#000000'},
effect:'drop',
api: true
}).load();
}
DIV OBJECT
<div class="modalpart" id="partmodal">
<h2>
Title <!--It doesn't matter what you put here-->
</h2>
<!--It doesn't matter what you put here-->
</div>
CSS
.modalPart {
background-color:#fff;
display:none;
width:550px;
padding:15px;
text-align:left;
border:2px solid #600;
-moz-border-radius:6px;
-webkit-border-radius:6px;
-moz-box-shadow: 0 0 50px #ccc;
-webkit-box-shadow: 0 0 50px #ccc;
position:fixed;
_position:absolute;
}
.modalpart h2 {
background:url(images/logoac.png) no-repeat;
margin:0px;
padding:10px 0 10px 110px;
border-bottom:1px solid #333;
font-size:20px;
color:#600;
font-family:calibri, hevetica, tahoma, arial;
text-align:right;
}