当用户点击按钮时引导向下滚动

Question

如何使用页面向下滚动，如in this example没有任何连接使用导航栏，特别是在JavaScript部分？

我想要发生的事情就像在这个例子中：一旦用户点击按钮，它将直接进入节页面，它应该像样本链接一样平滑滚动。

这里是我的示例代码

<div class="jumbotron"> 

<div class="career-jumbotron"> 
    <div class="container"> 
     <a href="#opportunities" class="page-scroll btn btn-xl"> 
     Button</a> 
    </div> 
</div> 
<section id="opportunities"> 
    <div class="container"> 

    -----sample text----- 

    </div> 
</section> 

Answer 1

下面是一段JavaScript代码，以获得平滑滚动同一页面链接，其手表和适用于所有环节的流畅的效果开始#

你需要添加jQuery库

$(function(){ 
    $('a[href*=#]:not([href=#])').click(function() { 
     if (location.pathname.replace(/^\//,'') == this.pathname.replace(/^\//,'') && location.hostname == this.hostname) { 
     var target = $(this.hash); 
     target = target.length ? target : $('[name=' + this.hash.slice(1) +']'); 
     if (target.length) { 
      $('html,body').animate({ 
      scrollTop: (target.offset().top - 135) // adjust this according to your content 
      }, 1000); 
      return false; 
     } 
     } 
    }); 
});