使用 jquery 向下滚动到 #lower div

Question

我正在尝试使用 jquery 向下滚动到 #lower div 但由于某种原因它不起作用。我做错了什么？

$(function() {

  $('html, body').animate({
    scrollTop: $("#lower").offset().top;
  }, 0); //end of animate 

}); //end of $(function()

#upper {
  border: 1px solid red;
  width: 100%;
  height: 100%;
}
#lower {
  border: 1px solid blue;
  width: 100%;
  height: 100%;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>

<div id='upper'>Upper</div>
<div id='lower'>Lower</div>

Answer 1

尝试删除 ; : Uncaught SyntaxError: Unexpected token ; 跟随 $("#lower").offset().top ；添加 top 属性到 #lower 大于 window.innerHeight 以提供 #upper 和 #lower 元素之间的视口距离

$(function() {

  $('html, body').animate({
    scrollTop: $("#lower").offset().top
  }, 0); //end of animate 

}); //end of $(function()

#upper {
  border: 1px solid red;
  width: 100%;
  height: 100%;
}
#lower {
  top:300px;
  position:relative;
  border: 1px solid blue;
  width: 100%;
  height: 100%;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js">
</script>

<div id='upper'>Upper</div>
<div id='lower'>Lower</div>

使用 jquery 向下滚动到 #lower div

Using jquery to scroll down to #lower div

javascript

php

jquery

scroll

vertical-scrolling