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

只需确保添加＆＃34; display：none＆＃34;到你的身体标签。它有效，但让我想知道如果JS被禁用会发生什么。

窗口调整大小并准备好文档

1 个答案: