html - 定位固定时iOS移动背景图像

Question

我希望我的背景图像保持在同一位置。所以我利用了

background-attachment:fixed;

当我发现 iOS 显然不支持这个属性时，我决定将一个固定的背景 div 放入 DOM 中。这实际上工作得很好:

#background {
    top:0;
    left:0;
    width:100%;
    height:100%;
    position:fixed;
    background-position:50% 0%;
    background-repeat:no-repeat;
    background-attachment:fixed;
    background-image:url("images/mark-bg.png");
}

乍一看，这在 iOS 中也很有效。但后来我意识到，Safari 会将 DIV 向上滚动到它本应滚动到的位置，如果它不被修复的话。

现在我问自己»到底是什么...？!«我的意思是...为什么 iOS 会滚动一个明确告知不要滚动的元素？

有什么智能化的解决方案吗？

Here is a complete Demo

编辑

我刚刚发现，不是元素自己移动，而是背景图像移动...

Answer 1

我找到了一个不太理想的解决方案，但至少它有效。我不再在 CSS 中使用 background-image 而是在背景 div 中放置一个 img 标签并将其绝对定位:

#background img {
    top:0;
    left:0;
    right:0;
    bottom:0;
    position:absolute;
}

Here is the fiddle

不幸的是，“这是文本”段落不再可见。幸运的是，那只是背景......

图像也不再居中， 也没有正确调整大小:[

编辑

我添加了以下 CSS 来修复定位:

#background img {
    margin-left:auto;
    margin-right:auto;
}