javascript - 窗口大小已调整且文档准备就绪

Question

所以我有一个几乎全高幻灯片的工作代码:

$(window).resize(function() {
    var winHeight = $(window).height(); 
    var headerHeight = $(".navbar").height(); 
    $('#slideshow-wrapper, #slideshow, #slideshow .overlay, #slideshow #slogan-wrapper, #slideshow .overlay').height(winHeight - 145);
});

$(window).trigger('resize');

代码有效，您可以在这里查看:

http://leda.rewind9.com/

如何将此代码包装在文档就绪函数中，以避免浏览器在计算 #slideshow 高度时出现初始闪烁？

我已经尝试过:

$(document).ready(function() {
    $(window).resize(function() {
        var winHeight = $(window).height(); 
        var headerHeight = $(".navbar").height(); 
        $('#slideshow-wrapper, #slideshow, #slideshow .overlay, #slideshow #slogan-wrapper, #slideshow .overlay').height(winHeight - 145);
    });
    $(window).trigger('resize');
});

但是闪烁不会消失。为了重现该问题，只需重新加载页面并检查幻灯片文本在居中之前如何“悬挂”。

有什么想法吗？

谢谢!

Answer 1

好的，快速简单的 jQuery 特定修复:

$(document).ready(function() {
 $('body').show();
});

只需确保将“display:none”添加到您的正文标记中即可。它有效，但让我想知道如果禁用 JS 会发生什么。