jQuery调整大小功能在Chrome中不起作用

本文介绍了jQuery调整大小功能在Chrome中不起作用的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！

问题描述

我有一个网页，该网页的顶部页眉图像很大，占据了整个视图的宽度和高度.我在网上找到了一个非常有用的代码段，该代码段避免了网址栏消失时在移动设备上发生的奇怪的调整大小问题.在添加下面的代码之前，URL栏消失时，标题图像的大小会增加，因为视图高度会变大.该代码可以正常运行，除非问题在iOS Chrome应用上仍然存在.非常感谢这里的任何帮助

I have a webpage with a large header image at the top of the page that occupies the entire view width and height. I found a very helpful snippet online that avoided the strange resizing issue that happens on mobile when the url bar disappears. Before including the code below, the header image would increase in size when the url bar disappeared because the view height would become larger. The code works perfectly except the problem persists on iOS Chrome app. Any help here is greatly appreciated

由于野生动物园和Chrome浏览器的网址栏高度不同，因此我决定采用新方法来解决此问题.这将导致不必要的复杂性，并且很难在两个浏览器上完美地进行调整.我采用的新方法是，在平板电脑或移动设备上查看网页时，我想将高度设置为加载时的视图高度，并将其保持在该高度.我已经将下面的jQuery代码更新到目前为止，但是仍然无法按预期工作.

I have decided to take a new approach to solving this problem since the URL bar height on safari and chrome vary. This would cause unwanted complications and it would be difficult to have the adjustment work perfectly on both browsers. The new approach I am taking is that when viewing the webpage on tablet or mobile, I would like to set the height to the view height on load and have it stay at that height. I have updated the jQuery code below to what I have so far, however it still does not work as expected.

链接到网页

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:

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

}

perfectly

jQuery调整大小功能在Chrome中不起作用

问题描述

推荐答案