Question

我的网站上有一个jQuery Tools Modal Overlay，它在Chrome和Firefox中都运行得很好......但是，当我在IE8中查看页面时，黑色背景蒙版出现在对话框DIV的顶部。另外，div出现在页面底部，实际代码与屏幕中心相反。

此外，我也得到其中一个“第1行第6个错误”错误“，我似乎无法调试这个坏男孩。我在Chrome中遇到类似的错误”未捕获的SyntaxError：意外的令牌）“但它不会干扰模态。我感觉它与它无关，但对于IE，你永远不会知道。

非常感谢任何帮助!!

JS档案

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;
 }

Answer 1

ACK！添加以下内容已更正了问题

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

在我开始调试20小时后，我不得不停止查询自己的问题，但是在我发布求助后30秒。

希望这对其他人也有帮助。

Answer 2

我遇到了完全相同的问题，我解决了这个问题：

<!doctype html>

Answer 3

抱歉，我的英语非常糟糕，我在IE8中有同样的问题，并使用IE8的IE8兼容性，这是工作，即ie7,8,9

#mask-modal{
position:absolute;
z-index:9000;
background-color:#fff;
display:none;}

div id =“＃mask-modal”

        if (jQuery.browser.msie == true && jQuery.browser.version == 8) {
            /* Carga el overlay confirmar */
            jQuery("#modalconfirmar .modalInput").overlay({
                // Calcula el centro de la ventana
                top : ((jQuery(parent.document).height() / 2) - (jQuery("#modalconfirmar").innerHeight() + 180 )),
                closeOnClick: false,
                onBeforeLoad: function(){
                    // @TODO cargar mask custom

                    //Get the screen height and width
                    var maskHeight = $(document).height();
                    var maskWidth = $(window).width();

                    //Set height and width to mask to fill up the whole screen
                    $('#mask-modal').css({
                        'width':maskWidth,
                        'height':maskHeight
                    });

                    $('#mask-modal').fadeTo(500,0.6);
                    // Load page into iframe
                    jQuery(document.body).css('overflow', 'hidden');
                },
                onLoad : function(){
                    jQuery("#modalconfirmar").css('z-index', jQuery("#mask-modal").css('z-index') + 10 );
                },
                onClose : function(){
                    jQuery("#modalconfirmar .si").off();
                    $('#mask-modal').fadeOut(400);
                }
            });}

JQuery工具模态叠加 - 在IE8中被破坏

3 个答案: