javascript - 在js中移动到同一页面中的新部分时制作动画

Question

$('#skip-intro').on("click", function() {
  var header = $('.navbar').innerHeight();
  $("html, body").animate({
    scrollTop: $('#intro').offset().top - header
  }, 1000);
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<a href="#intro" id="skip-intro">Get to Know</a>
<div class="section-block" id="intro">
  ----content------
</div>

在这里，帮助我找出为什么动画属性在向下移动到以下部分时不起作用。

标签： javascriptjqueryhtml

Answer 1

原文在这里：在这里找到它（但它是德语）

$('a[href*="#"]').on('click',function(e) {
 e.preventDefault();
 var target = this.hash;
 var $target = $(target);
 $('html, body').stop().animate({
  'scrollTop': $target.offset().top
 }, 900, 'swing', function () {
  window.location.hash = target;
 });
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<a href="#exp">Href</a>
<div style="height:1000px; background:red;"></div>
<div id="exp" style="background:green; text-align:center;">jdaslkasd</div>