iPhone /平板电脑上未显示背景图片

Question

我的iphone /平板电脑上没有显示背景图片！ 有趣的是，如果您使用笔记本电脑，但将窗口大小设置为iPhone /平板电脑的大小，它仍然会显示出来（尝试调整站点大小）。

#intro {
background: url('imageurlhere') no-repeat right fixed;
background-color: #fdfdfd;
-webkit-background-size: 50% 125%;
-moz-background-size: auto 125%;
-o-background-size: auto 125%;
background-size: auto 125%;
filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='imageurlhere', sizingMethod='scale');
-ms-filter: "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='imageurlhere', sizingMethod='scale')";
padding-top: 10%;
}

如果我取消“固定”参数，它将显示但视差将消失。

有没有什么办法解决这一问题？ 谢谢！

Answer 1

问题出在位置y：固定了便利属性。

iOS上的Safari无法识别fixed因此它忽略了整个规则（请参阅随附的屏幕截图）。

去掉：

background: url(http://i.imgur.com/CVJVeWw.jpg) no-repeat right fixed;

并添加：

background-repeat: no-repeat;
background-size: auto 125%;
background-position-x: right;
background-position-y: fixed;
background-image: url(http://i.imgur.com/CVJVeWw.jpg);

更新请参阅background-position-y和background-attachment: fixed

我玩了一点，看是否可以为您更好地工作。 由于某种原因，当两个background-attachment: fixed;都background-attachment: fixed; and background-position-x: right; 是在iOS 6x上指定的，背景丢失了。 但是，通过重置background-attachment: fixed; 到initial虽然你失去了视差的图像显示。

所以：在桌面上尝试一下：

#intro {
    background-attachment: fixed;
    background-repeat: no-repeat;
    background-position-x: right;
    background-position-y: center;
    background-image: url(http://i.imgur.com/rKJbwgL.jpg);
    background-color: #fdfdfd;
    -webkit-background-size: 110% 110%;
    -moz-background-size: auto 125%;
    -o-background-size: auto 125%;
    background-size: auto 110%;
    filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='http://i.imgur.com/rKJbwgL.jpg', sizingMethod='scale');
    -ms-filter:"progid:DXImageTransform.Microsoft.AlphaImageLoader(src='http://i.imgur.com/rKJbwgL.jpg', sizingMethod='scale')";
    padding-top: 10%;
    margin-right: -10%;
}

然后在媒体查询中查找电话/平板电脑，重置背景附件：

background-attachment: initial;

让我知道这是否对您更好。