私のウェブサイトでJquery Scrollifyを実装できません

JQuery Scrollifyを自分のウェブサイトに設定して、あるセクションから他のセクションへのスムーズなスクロールを実現しようとしていますが、動作させることはできません！私はさまざまな方法を試してみて、何かが欠けているかもしれないと思う？私は、スクリプトを正しく実装していないか、セクションにクラス名を与えていない可能性があると思います。おそらく、私がブートストラップを使用しているからでしょうか？私のウェブサイトでJquery Scrollifyを実装できません

ここをクリックしてください！どうもありがとうございます！ここで

は私のHTMLです：

<!DOCTYPE html> 
<html lang="en"> 
<head> 
    <meta charset="UTF-8"> 
    <meta name="viewport" content="width=device-width, initial-scale=1"> 
     <title>...</title> 
     <link href="css/magicledger.css" rel="stylesheet" type="text/css"> 
     <link href="css/normalize.css" rel="stylesheet" type="text/css"> 
     <link href="css/bootstrap.min.css" rel="stylesheet"> 

    <script> 
    $(function() { 
$(".section").css({"height":$(window).height()}); 
    $.scrollify({ 
    section:".section" 
    }); 


    $(".scroll").click(function(e) { 
    e.preventDefault(); 
    $.scrollify("move",$(this).attr("href")); 
    }); 
}); 
     </script> 
</head> 

<body> 
     <section class="section section1"> 
     <header class="jumbotron vertical-center"> 
      <div class="container"> 
       <h1>...</h1> 
       <h3>...</h3> 
      <script type="text/javascript"> 
      window.Maitre = { uuid: "MF301766dea0" }; 
    </script> 
    <script data-maitre src='https://maitreapp.co/widget.js' async></script> 
      </div>  
     </header> 
    </section> 


<div class="container-fluid"> 
    <section class="section section2"> 
    <div class="row"> <!------- Row 1 -----> 
     <div class="col-md-6"> 
      <div class="inside-row"> 
      <img src="icons/animat-bezier-color-2.gif" alt="icon1"> 
      </div> 
     </div> 
     <div class="col-md-6"> 
      <div class="inside-row"> 
       <h3>...</h3> 
       <p>...</p> 
      </div> 
     </div> 
    </div> 
    </section> 
    <section class="section section3"> 
     <div class="row"> <!-- Row 2 --------> 
      <div class="col-md-6"> 
       <div class="inside-row"> 
       <img src="icons/animat-layers-color-2.gif" alt="icon2"> 
       </div> 
      </div> 
      <div class="col-md-6"> 
       <div class="inside-row"> 
        <h3>...</h3> 
        <p>...</p> 
       </div> 
      </div> 
     </div> 
    </section> 
    <section class="section section3"> 
     <div class="row"> <!-- Row 3 ----------> 
      <div class="col-md-6"> 
       <div class="inside-row"> 
       <img src="icons/animat-network-color-2.gif" alt="icon3"> 
       </div> 
      </div> 
      <div class="col-md-6"> 
       <div class="inside-row"> 
        <h3>...</h3> 
        <p>...</p> 
       </div> 
      </div> 
     </div> 
    </section> 
</div> <!-- ENd of container fluid ------>

と私のjavascript extrernalシート：あなたがの.jsファイルを含むされている

jQuery(document).ready(function($) { 

$.scrollify({ 
     section : ".section-class-name", 
     sectionName : "section-name", 
     easing: "easeOutExpo", 
     scrollSpeed: 1100, 
     offset : 0, 
     scrollbars: true, 
     standardScrollElements: "", 
     setHeights: true, 
     before:function() {}, 
     after:function() {}, 
     afterResize:function() {}, 
     afterRender:function() {} 
    });

出典

2016-03-29 Anso Asselin