反拉伸和背景尺寸：封面

Question

我目前在單頁網站上使用CSS作為全屏背景（由相互之間1300px高度的幾個DIV組成）。 效果很好，背景圖像在頁面的可見部分是全屏的，但在ipad上不起作用。 反拉伸的問題是，如果我包含此代碼

 <script>
 $("#medias").backstretch("../images/bg-18.jpg");

在我的“媒體” DIV中，背景圖像覆蓋了我的DIV的全部大小（即1300高度*寬度），這不是我希望它僅覆蓋瀏覽器窗口的大小。

帶CSS方法的DIV示例：

#medias {
    height: 1300px;
    background: #8aba56;
    padding-top: 150px;
    background: url(../images/bg-18.jpg) no-repeat center fixed;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    background-size: cover;
    -ms-background-size: cover;
    -o-background-size: cover;
}

Answer 1

我最初使用了backstretch，因為CSS似乎無法在iPad上使用。 正是您所描述的。 但是，奇怪的是，在嘗試了CSS並進行了以下更改之后：

背景圖片：url（'background.jpg'）;

至，

背景圖片：網址（'www.imgur.com/background.jpg'）

背景在iPad上起作用。 似乎將背景圖像的位置更改為直接網址，iPad即可生成圖像。 因此，請嘗試將圖像上傳到臨時服務器（例如imgur），然后將CSS中的鏈接更改為imgur鏈接。

奇怪的是它對我有用。