スムーズスクロールがスムーズにスクロールしない

Question

スムーススクロールに関する話題がたくさん読んでいます。 "js/script.js"フォルダファイルにコードを書き込んで、メインページの一番下に "script.js"リンクをコピーしました。メインのindex.htmlに円滑なスクロールのためのスクリプトを書く必要がありますか？私はそのページをできるだけクリーンかつ簡潔に保ちたい、したがってアウトソーシングしたい。それはこの1つまたは私はオンラインで見つけるコードをスクロールする任意の他の素晴らしい作品だ場合

$('a[href^="#"]').on('click', function(event) { 
var target = $(this.href); 
if(target.length) { 
    event.preventDefault(); 
    $('html, body').animate({ 
     scrollTop: target.offset().top 
    }, 700); 
} 
}); 

は本当に重要ではありません、私のテストページは、まだWindows 98のPC版のようにスクロールします。

私はそうのように、適切に各hrefとclassを定義していると信じている：

 `<ul class="nav navbar-nav"> 
      <li class="nav-item"> 
       <a href="#page-top">Home</a> 
      </li> 
     </ul> 
     <ul class="nav navbar-nav"> 
      <li class="nav-item"> 
       <a href="#about">About us</a> 
      </li> 
     </ul> 
     <ul class="nav navbar-nav"> 
      <li class="nav-item"> 
       <a href="#contact">Contact</a> 
      </li> 
     </ul>` 

がCoulyあなたが私を助けてください？

PS：JS = jQueryですか？

Answer 1

は

$(document).ready(function(){ 
    $('.yourClass').on('click', function(event) { 
     ... 
    } 
)}; 

そして、あなたのHTMLのようにアクションのクラスを定義してみてください。

<ul class="nav navbar-nav"> 
    <li class="nav-item"> 
     <a class="yourClass" href="#contact">Contact</a> 
    </li> 
</ul> 

また、jQueryのは、JavaScriptを拡張するlibaryです。したがって、あなたのindex.htmlに最新のjQueryが含まれていることを確認してください。

<script src="http://code.jquery.com/jquery-latest.min.js" type="text/javascript"></script>