JQuery Tools Modal Overlay - не работает в IE8 - PullRequest
3 голосов
/ 25 июня 2010

У меня есть модальное наложение jQuery Tools на моем веб-сайте, и оно прекрасно работает как в Chrome, так и в Firefox ... однако, когда я просматриваю страницу в IE8, в верхней части диалогового окна DIV появляется маска черного фона.Кроме того, div отображается в нижней части страницы, где фактический код отличается от центрированного на экране.

Кроме того, я также получаю одну из этих «Ошибка в строке 1, символ 6«Ошибки», и я не могу отладить этого плохого парня. Я получаю похожую ошибку в Chrome «Uncaught SyntaxError: Неожиданный токен)», но это не мешает модалу. У меня такое чувство, что оно не связано, но с IE, вы никогда не знаете.

Любая помощь будет очень признательна !!

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

Ответы [ 3 ]

9 голосов
/ 25 июня 2010

ACK! Добавление следующего исправило проблему

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

Мне нужно перестать выяснять свой вопрос через 20 часов после начала отладки, но через 30 секунд после того, как я отправлю справку.

Надеюсь, это поможет и кому-то еще.

3 голосов
/ 01 марта 2012

У меня была точно такая же проблема, и я решил ее, добавив следующую строку:

<!doctype html>
0 голосов
/ 25 января 2013

извините, мой английский очень плох, у меня такая же проблема в IE8, и я использую совместимость с IE8, а не с IE7, это работа с ie7, 8, 9

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

div id = "# маска-модал "

        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);
                }
            });}
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...