Question

我建立了一个包含完整背景图片的响应式网站。它在桌面上运行得很好，但是当我在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');
});

iPad在旋转前不显示内容

0 个答案: