0

我的背景图片没有出现在 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%;
}

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

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

4

1 回答 1

3

问题出在 position-y: fixed 的便利属性上。

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;

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

于 2013-08-18T19:52:35.507 回答