視差画像を視差行内に追加する方法

Question

視差を実装しようとしている視差を実装しようとしています。

私はいくつかの成功を収めているが、それはこれだけは、私がその領域にスクロールしたときに、それがどのように見えるかである816pxより狭い画面上で動作するようです：

そして、ここでは、それは次のようになります幅が816pxの上にあるとき：

ない、誰もが、特にこれを助けることができるようになりますが、これを達成するための「正しい」方法があるかどうかを知りたいと思うかどうかわから、または使用可能な実装/プラグインがある場合

私は残りのサイトにブートストラップフレームワークを使用しています（応答性が内部イメージを押し下げていると感じました）。ここ

コードである：

HTML

<div class="container-fluid" style="padding:0px;"> 
    <div class="parallax-window" 
     data-parallax="scroll" 
     data-image-src="Phonehand.png" 
     data-position-y="500px" 
     data-speed="0.3"> 
     <div class="parallax-window" data-parallax="scroll" data-image-src="Chrysanthemum.jpg" data-speed="0.8" > 
     </div> 
    </div>  
</div> 

CSS

.parallax-window { 
    width: 100%; 
    min-height: 400px; 
    background: transparent;  
} 

ジャバスクリプト

私はParallax.jsプラグインを使用していますhere

私は詳細を提供できるかどうかお知らせください。

Answer 1

私は100pxににdata-position-yを変更することでこの問題を解決することができた：

<div class="container-fluid" style="padding:0px;"> 
<div class="parallax-window" 
    data-parallax="scroll" 
    data-image-src="Phonehand.png" 
    data-position-y="100px" 
    data-speed="0.3"> 
    <div class="parallax-window" data-parallax="scroll" data-image-src="Chrysanthemum.jpg" data-speed="0.8" > 
    </div> 
</div>