バックグラウンドアタッチメント：iOSで固定機能が動作しない

Question

iOSデバイスで固定背景を使用している問題の解決方法を見つけようとしています。むしろ、このWebサイトのすべてを再設計する必要はなく、一部のCSS変更で修正できることを期待しています。 ThisはiPhoneでのサイトの外観で、thisのようになります。次のように私が使用しているCSSのコードは次のとおりです。

.container { 
    min-width: 320px; 
    max-width: 480px; 
    margin: 0 auto; 
} 

.fixed-background { 
    height: 800px; 
    -webkit-backgound-size: cover; 
    -o-backgound-size: cover; 
    -moz-backgound-size: cover; 
    background-size: cover; 
    background-attachment: fixed; 
    background-repeat: no-repeat; 
    background-position: center center; 
    text-align: center; 
    overflow: auto; 
} 

私もstackoverflowの上でいくつかの記事を使用してiOSのためにそれを修正する@mediaクエリを使用して試してみたが、これはどんな効果を持っていないようでした。

@media screen and (min-color-index:0) and (-webkit-min-device-pixel-ratio:0) { 
    .fixed-background { 
     background-attachment: scroll; 
    } 
} 

HTML

<div class="fixed-background bg-1"> 
    <div class="container"> 
     <div class="title"> 
      <h1>ROOK PROPERTY<br>MANAGEMENT INC.</h1> 
      <h2>CONDOMINIUM MANAGEMENT</h2> 
     </div> 
    </div> 
</div> 

Answer 1

私はちょうど同じ問題を経て、これは私がそれを解決する方法です。

まず、あなたが100％の幅と高さが100％であるためにあなたの体とhtmlを宣言する必要があります：

html, body{ 
 
\t width: 100%; 
 
\t height: 100%; 
 
}

次に、ページ上のスクロールがすることによって行うことができません本体：コンテナに包む必要があります。このコンテナには、オーバーフロー：スクロール、幅：100％、高さ：100％の3つのパラメータが必要です。タッチ：あなたはそれをスクロールする方法が気に入らない場合、あなたはまた -webkit-オーバーフロースクロールを追加してみてくださいすることができます

#wrapper{ 
 
\t \t width: 100%; 
 
\t \t height: 100%; 
 
\t \t overflow: scroll; 
 
\t }

：私はそれでサイト全体を包むお勧めします。

あなたを助ける希望/誰かがこれを探しに来てくれます！

.parallax { 
width: 100%; 
background url(../images/bg.jpg) no-repeat center center; 
-webkit-background-size: cover; 
-moz-background-size: cover; 
-o-background-size: cover; 
background-size: cover; 
} 

そして最後に、それは私の製品

.paraxify { 
    background-attachment: fixed; 
    background-position: center center; 
    background-size: cover; 
} 

以外のすべてのための視差作る：私はクラスにclass="parallax iparaxify paraxify" を追加し、私は私のメインのCSSファイルで固定された背景を持つすべての私のdivに

Answer 2

終了時に、ipad、iphone、jqueryのipodのposition:fixedを無効にする

​​