Question

任何人都可以告诉我哪里出错了...我使用以下内容通过设置margin-top来垂直对齐div，使用（window）.height。 625是Div居中的高度......

这适用于Firefox，但在调整浏览器窗口大小之前，IE7不会设置margin-top。

测试网站位于http://guylloyd.co.uk

任何想法都会非常感激！

马丁

jQuery.noConflict();
jQuery(document).ready(function () {

jQuery(function(){   
var $marginTop = ((jQuery(window).height() - 625) / 2 + 'px');
if(jQuery(window).height() > 625){
jQuery('body').css({'margin-top': $marginTop});   
}
});

jQuery(window).resize(function(){
var $marginTop = ((jQuery(window).height() - 625) / 2 + 'px');
if(jQuery(window).height() > 625){
jQuery('body').css({'margin-top': $marginTop});
}
});

}）;

Answer 1

你真的不需要使用jquery以这种方式布局内容，简单的css和xhtml可以达到同样的效果。

这可能与IE6中的问题相同，导致javascript执行延迟尝试包括超时和调用Seth设计的代码

function doResize() {   
    var $marginTop = ((jQuery(window).height() - 625) / 2 + 'px');   
    if(jQuery(window).height() > 625){   
        jQuery('body').css({'margin-top': $marginTop});   
    }   
}  
//when document has been fully loaded
jQuery(document).ready(function()
{
    setTimeout('doResize()', 1 );

});

Answer 2

我不确定你的实际问题，这就是IE7在你调整窗口大小之前没有设置边距的原因，但你可以考虑减少这样的冗余代码：

function doResize() {
    var $marginTop = ((jQuery(window).height() - 625) / 2 + 'px');
    if(jQuery(window).height() > 625){
        jQuery('body').css({'margin-top': $marginTop});
    }
}

jQuery.noConflict();
jQuery(document).ready(doResize);
jQuery(window).resize(doResize);

对于IE，如果向方法添加一些警告语句会发生什么，这样您就可以知道它们何时被调用。 IE7没有执行document.ready功能吗？或者它正在执行，但没有做任何事情？

使用jQuery垂直对齐Div以设置margin-top

2 个答案: