0

我正在构建一个具有完整背景图像的响应式网站。它在台式机上效果很好，但是当我在 iPad 上尝试时，在旋转屏幕之前我什么都看不到。有时我必须这样做几次才能真正看到内容和背景图像。

奇怪的是，在这样做之后，一切似乎都很好。

有任何想法吗？

PS：我没有在其他平板电脑上尝试过该网站，所以我不知道这是一个孤立的问题还是每台平板电脑都会发生同样的事情。

-- 编辑：代码 --

好的，代码如下：

HTML - 只是一个带有背景图像的空 Div

<div class='bkgTablet' id='bkgHome'>
</div>

CSS

div.bkgTablet {
    width:100%;
    position:absolute;
    top:0px;
    left:0px;
    z-index:-4; 
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover; 
}

div#bkgHome {
    background: url(../images/indexBkg1tab.jpg); 
}

（带有媒体查询的横向或纵向显示不同的图像）

高度是用 jQuery 设置的

$(document).ready(function() {
    $('.bkgTablet').css("height", $(window).height() + 'px');
}); 

$(window).bind("resize", function() {
    $('.bkgTablet').css("height", $(window).height() + 'px');
});
4

0 回答 0