Блог

Некоторое время назад у меня была проблема с всплывающими диалоговыми окнами, высота которых выходила за пределы фона. Полупрозрачное наложение остановилось посередине, и все под ним было черным. Мой друг исправил это за меня. Он сказал:

«Для проблемы с диалогом я использовал 900 пикселей для ширины и высоты. Невозможно выполнить исправление исключительно с помощью CSS, потому что значения в конечном итоге перезаписываются, когда вызывается javascript для отображения диалогового окна. Что нам нужно сделать, так это после открытия / создания диалогового окна изменить размер фонового наложения в соответствии с размерами страницы. Вы можете увидеть это в index.html для дополнительных функций.»

К сожалению, это исправление не применяется, когда ширина и высота установлены в «auto».

Может кто-нибудь, пожалуйста, помочь мне здесь? Спасибо.

    $("<div class='popupDialog'>Loading...</div>")
        .dialog({
            autoOpen: true,
            closeOnEscape: true,
            width: '900',
            height: '900',
            modal: true,
            title: 'Bonus Features',
            beforeClose: function(){   $(this).remove();   }
        }).load(url, function() {
            $(this).dialog("option", "position", ['center', 'center'] );
        });


        adjustJQueryDialogOverlay();
    }

    $(window).resize(function() {
        $(".ui-dialog-content").dialog("option", "position", ['center', 'center']);
    });
  

 function openDialog(url) {
    $("<div class='popupDialog'>Loading...</div>")
        .dialog({
            autoOpen: false,
            closeOnEscape: true,
            width: '900',
            height: 'auto',
            modal: true,
            title: 'Bonus Features',
        }).bind('dialogclose', function() {
            jdialog.dialog('destroy');
        }).load(url, function() {
            $(this).dialog("option", "position", ['center', 'center'] ).bind('dialogopen', function() {
                    adjustJQueryDialogOverlay();
                });
                $(this).dialog("open");
        });
}

$(window).resize(function() {
    $(".ui-dialog-content").dialog("option", "position", ['center', 'center']);
});