Question

我刚刚在我的javascript游戏项目中实现了弹出框;然而，他们有时会出现在不正确的位置（主要是一直到页面右侧），而不是像他们想象的那样居中。

查看正确位置的示例：

查看错误排名的示例：

这是一个名为的弹出函数：

//buttons can be an object or string
//if string (any string), will use default button
function popup(title,message,buttons,time){
    $('#popup p[name="title"]').text(title);
    $('#popup div[name="content"]').html(message);
    $('#popup span[name="buttons"] :not(button[name="continue"])').remove();
    $('#popup span[name="buttons"] button').hide();

    if(buttons != null){
        if(typeof buttons == 'object'){
            //snip
        }else{
            $('#popup button[name="continue"]').show();
        }
    }else{
        setTimeout(function(){
            $('#popup').hide(750);
        },(time+750));
    }

    //center
    $('#popup').position({
        my : 'center',
        at : 'center',
        of: $('body')
    });

    $('#popup').show(750);
}

Answer 1

你试过吗？使它成为位置：绝对

因为我看不到你的实际html布局设计。我建议你试试这个。

$(document).ready(function () {

    $("#popup").css({
        "position": "absolute",
        "top": windowHeight/2-popupHeight/2,
        "left": windowWidth/2-popupWidth/2,
        "z-index": 2000 
    });

});

Answer 2

试试这个

    $(document).ready(function () {
    //buttons can be an object or string
    //if string (any string), will use default button
    function popup(title, message, buttons, time) {
        $('#popup p[name="title"]').text(title);
        $('#popup div[name="content"]').html(message);
        $('#popup span[name="buttons"] :not(button[name="continue"])').remove();
        $('#popup span[name="buttons"] button').hide();

        if (buttons != null) {
            if (typeof buttons == 'object') {
                //snip
            } else {
                $('#popup button[name="continue"]').show();
            }
        } else {
            setTimeout(function () {
                $('#popup').hide(750);
            }, (time + 750));
        }

        //center
        $('#popup').position({
            my: 'center',
            at: 'center',
            of: $('body')
        });

        $('#popup').show(750);
    }
    $('#popup').css({ 'position': 'absolute', 'left': '0', 'right': '0', 'bottom': '0', 'top': '0', 'margin': 'auto' });
});

弹出框不像它们应该的那样居中

2 个答案: