どのように視差にカーテン効果を追加する

Question

私はこのような視差でテキストのエフェクトを追加したいのですが（リンクを確認してください） - >https://ihatetomatoes.net/demos/simple-parallax-scrolling-tutorial/どうすればいいですか？いくつかのプラグインが必要ですか？とにかくここにあなたが言うとき、「あなたはプラグインが必要なのですか」私のサンプルコードですかこのjsfiddle https://jsfiddle.net/hfnm54yb/

HTML: 
<!--section 1 --> 
<section id="slide-1" class="homeSlide"> 
    <div class="content"> 
     <div class="parallax-bg1"> 
      <h1>add content here...</h1>    
     </div> 
    </div>    
</section> 




<!--section 2 --> 
<div class="content2"> 
    <div class="parallax-bg2"> 
     <h1> add content here...</h1> 
    </div> 
</div>   




<!--section 3 --> 
<div class="content3"> 
    <div class="parallax-bg3"> 
     <h1> add content here...</h1> 
    </div> 
</div>   





CSS: 
    .parallax-bg1 { 
     padding:300px 0; 
     background-color:red; 
     background-size: cover; 
     background-attachment: fixed; 
     } 

    .parallax-bg2 { 
     padding:300px 0; 
     background-color:blue; 
     background-size: cover; 
     background-attachment: fixed; 
     } 



     .parallax-contact{ 
     padding:300px 0; 
     background-color: red; 
     background-size: cover; 
     background-attachment: fixed; 
     } 


    h1 { 
     background: none; 
     padding-left: 0; 
     padding-right: 0; 
     color:black; 
     } 

Answer 1

を確認...あなたは正しくチュートリアルプラグインを設定することがありますか？あなたのチュートリアルから（*の手順に従うとかなりうまくいく）リンクされているので、https://github.com/Prinzhorn/skrollrをインストールする必要があります。 jQueryをまだ持っていない場合は、おそらくこれも含める必要があります。

これは、より詳細なチュートリアルのようになります。このプラグインでhttps://ihatetomatoes.net/how-to-create-a-parallax-scrolling-website