我试图通过一些基本的javascript标记来实现全高介绍性部分。

更详细地:
我得到了一个父DIV元素,该元素充当包装器并应适应整个视口高度。由于某些移动设备不兼容,css“高度:100vh”无法正常工作。因此,我坚持使用此代码。前一阵子效果很好。我没有做任何更改,突然它在一夜之间停止在chrome中工作?!无法正确计算高度。

我附上了我的代码和一些案例的屏幕截图。

我敢肯定你可以帮助我。
先感谢您
Working sample
Chrome bug

$(document).ready(function(){

'use strict';

setInterval( function() {

    var windowHeight = $(window).height();

    var containerHeight = $("#intro-wrapper > .inner").height();

    var navHeight = $("header#main").outerHeight(true);

    var border = 20;

    var padTop = windowHeight - 20 - (containerHeight+navHeight);

    $("#intro-wrapper > .inner").css ({

        'padding-top': Math.round(padTop / 2) + 'px',
        'padding-bottom': ((padTop / 2)- border) + 'px',
        'margin-bottom': border + 'px'
    });

}, 0);
});

最佳答案

尝试在CSS中使用height:100vh;获得全高。

08-25 12:27
查看更多