覆盖背景图片和jquery本地滚动答案

【问题标题】：Covering background img and jquery localscroll覆盖背景图片和jquery本地滚动
【发布时间】：2015-09-06 05:07:49
【问题描述】：

我正在为我的网站使用引导程序并让 localscroll 正常工作（我使用标准导航条码）。到目前为止一切顺利。

接下来我想实现一个在台式机和移动设备（iphone、android 等）上正常工作的全屏背景。背景图片应覆盖整个屏幕，并且在用户滚动页面内容时不应移动。我能找到的唯一解决方案（经过相当长的搜索）是这样的：

html {
    background: url('images/ny-building-xs-optimized.jpg') no-repeat center center fixed !important;
    background-size: cover !important;
    height: 100%;
    overflow: hidden;
}

body {
    height: 100%;
    overflow: scroll;
    -webkit-overflow-scrolling: touch; /* smooth scrolling on ios */
}

这很好用！

现在，如果我将此全屏背景 css 与 localscroll 结合使用。 Localscroll 停止工作。这很奇怪，因为我在某处读到，为了让 localscroll 工作，您需要设置一个高度并将溢出设置为滚动。两者都设置好了。

如果我删除了 overflow: hidden css from the html tag than localscroll 工作，但背景在我的 iphone 上无法正常工作（它滚动并放大到内容的完整大小 - 而不是视口）。

有没有人有一个解决方案，其中背景图片工作和本地滚动继续工作？

谢谢！

【问题讨论】：

标签： jquery html ios css

【解决方案1】：

我最终为静态背景使用了一个单独的 div，这解决了我所有的问题。

然而，这导致了移动设备上的一个新问题。见White area on fixed background when scrolling on ios

【讨论】：