替代.resize（）适用于Chrome吗？

我有一个网页，我正在使用页面顶部的全屏图像标题。在移动设备上，图片大小调整时会出现问题，因为视图高度会发生变化，导致图片尺寸发生变化，因此URL滚动条会在滚动中消失。我遇到了以下代码片段的一个变体，它完美地解决了这个问题，但它不能解决iOS Chrome应用程序中的问题。我发现原因是因为Chrome不支持这个.resize()函数。我想知道是否有人知道这是由铬支持的替代方案？我还会加入与这种情况相关的HTML。替代.resize（）适用于Chrome吗？

HTML：

<div class="intro-bg"> 
      <div class="intro-bg-item"> 
       <div class="intro-bg-item-image" style="background-image: url(css/images/pb/home-banner.jpg)"></div><!-- /.intro-bg-item-image --> 
      </div><!-- /.intro-bg-item --> 

     </div><!-- /.intro-bg -->

的jQuery：

var bg = $(".intro-bg-item-image, .intro-bg-item, .intro-bg, .caroufredsel_wrapper"); 

function resizeBackground() { 
    bg.height($(window).height() + 60); 
} 

$(window).resize(resizeBackground); 
resizeBackground();

来源

2017-04-18 S. Miller

@razorsyntax这个人不知道如何调整窗口的大小。我想弄清楚如何在Chrome中调整窗口大小的功能。 –

所以听滚动也在移动 – epascarello

尝试使用setInterval函数 - setInterval（function（）{resizeBackground（）;}，1000）; – Victoria

我决定来解决这个问题的最好办法是设置在页面加载到视图高度的高度在平板电脑上观看时，或更小的设备。

的jQuery：

if ($(window).width() <= 1024) { 
    var bg = $(".intro-bg-item-image, .intro-bg-item, .intro-bg, .caroufredsel_wrapper"); 
    function resizeBackground() { 
     bg.height($(window).height()); 
    } 
    $(window).load(resizeBackground); 
    resizeBackground(); 
}

来源

2017-04-20 18:40:02

替代.resize（）适用于Chrome吗？

回答

相关问题