背景图像没有出现在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

我更多地玩这个，看看我是否能让它更适合你。出于某种原因，当在iOS 6x上指定background-attachment: fixed;和background-position-x: right;时，背景会丢失。但是，通过重置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;

请告诉我这是否适合您。