jquery - 弹出框没有像它们应该的那样居中

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

试试这个

    $(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' });
});