Question

我有以下代码：

function c() {
        var h = ($(window).height() - $('#maincontainer').outerHeight()) / 2;
        var w = ($(window).width() - $('#maincontainer').outerWidth()) / 2;

        $('#maincontainer').css('position', 'absolute');
        $('#maincontainer').css('top', h);
        $('#maincontainer').css('left', w);
    }

    $(window).resize(c);
    $(window).load(c);

resize事件在我尝试的每个浏览器上都能正常运行，但load始终返回宽度值8px，将maincontainer div放在屏幕的左边框上。这样就可以在IE8上正确地在窗口中间放置一个div，在Chrome 22和Firefox 16上失败。

编辑：似乎有效的解决方案：

    $(window).ready(c);
    $(window).load(c);
    $(window).resize(c);

此外，the body应该有width: 100%。

Answer 1

而不是：

$(window).resize(c);
$(window).load(c);

做的：

$(function(){
    c();
    $(window).resize(c);
});

正在发生的事情是你在加载任何东西之前要求文件的大小，所以你几乎什么都得不到。只要文档“准备就绪”，它就会立即执行，因此会为您提供更有用的值。

您可能还需要使您的身体100％宽度和高度，并使用该尺寸而不是窗口。

Chrome和Firefox上的窗口宽度错误

1 个答案: