修复了ipad（iOS5）上的背景问题

目前正在建立一个新的博客，并且在ipad上有固定封面背景的问题-在浏览器上运行良好，但在ipad上滚动，尝试了很多事情，包括创建一个单独的背景div，位置：fixed z-index:-1；产生了同样的效果

我不知道为什么会发生这种情况，因为我认为position:fixed和background attachment:fixed应该在iOS5中进行排序

---

您可以在此处查看：

您可以通过

@media screen and (min-width: 1023px){
body {
    background: cover;/*etc*/
    width: 100%; 
    height: 100%; 
    position: absolute; 
  }
}

到处玩。你也可以加上

@media screen and landscape and (min-width: 1023px)

还有肖像画，让ipad设备更受欢迎。

---

希望能有所帮助。

在寻找解决方案的几天后，这里是：

这就是我的工作原理：

* {
    margin: 0;
}
html, body {

    height: 100%;
    overflow: auto;
    overflow-y: scroll !important; 
}
#background_wrap {
    background: #000000 url(xxxxx.jpg); no-repeat center center fixed;
   -webkit-background-size: cover; 
   -moz-background-size: cover; 
   -o-background-size: cover; 
    background-size: cover; 
    background-position: center; 
   -webkit-overflow-scrolling: touch !important;  
    z-index: 0;
    position: relative;
    width: 100%;
    height: 100%;
    overflow: auto;
}

#page {
   -webkit-backface-visibility: hidden;

}
.box {
    position: fixed;
    left: 10px;
    top: 180px;
}
* html .box {
    position: absolute;
}

---

你试过这个方法吗？将其放入窗口的onScroll事件处理程序中：

if(navigator.platform == 'iPad' || navigator.platform == 'iPhone' || navigator.platform == 'iPod')
{
    //set background fixed with javascript
    var element = document.getElementById('background');
    element.style.webkitTransform = "translate3d(0, " + window.pageYOffset + "px, 0)";
};

---

我以前一直在尝试这个，我能得到的唯一结果是背景覆盖了整个内容的100%，包括滚动（如此拉伸到像4000px高）。奇怪的是，我的左面板（徽标/说明）也被定位为固定面板，并在iPady上继续滚动。你可以尝试使用：背景重复：无重复；背景大小：contain；。也可以使用safari-webkit背景剪辑：填充框；我能想到的另一个解决方案是创建一个标题宽度为Wu的div，另一个标题宽度为left menu width and height的div，以及一个内容宽度和高度为content width and height的div，并放置在内容中，然后用scroll-y滚动，这样效果div（标题、leftmenu、内容）将是固定的…只是抛砖引玉，希望你能找到解决方案，