0

我有以下代码：

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 的宽度值，将maincontainerdiv 放在屏幕的左边框上。这仅在 IE8 上正确执行，在窗口中间放置一个 div，在 Chrome 22 和 Firefox 16 上失败。

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

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

还有，the body应该有width: 100%。

4

1 回答 1

1

代替：

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

做：

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

发生的事情是您在加载任何内容之前询问文档的大小，因此您（几乎）什么也得不到。一旦文档“准备好”，就会立即执行此操作，从而为您提供更有用的价值。

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

于 2012-10-18T10:36:12.797 回答