背景图100%出现滚动条时会有空白bug

Posted 2020-09-25

 

.loginWrap { position:absolute;top: 0;left: 0;width:100%;height: 100%;}

window.onresize = function(){
    var widthOfMobile = $(‘#warpBackground‘). outerHeight();
    var withoutMargin = $(‘#mobileWarp‘). outerHeight();
    $(‘#mobileBg‘).css(‘height‘,widthOfMobile);
    $(‘#bg‘).css(‘height‘,withoutMargin);
}

动态控制bg的高度 使其始终等于html 这样就不会出现空白区域，
outerHeight()元素距离顶端的高度 （加上滚动条的距离）