javascript - 使用jquery向下滚动到#lower div

标签 javascript php jquery scroll vertical-scrolling

我正在尝试使用 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>

最佳答案

尝试删除 ; : Uncaught SyntaxError: Unexpected token ; 后面的 $("#lower").offset().top ;将 top 属性添加到 #lower 大于 window.innerHeight 以提供 #upper 之间的视口(viewport)距离#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>

关于javascript - 使用jquery向下滚动到#lower div,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/34553115/

相关文章:

javascript - 二叉搜索树 JavaScript 实现 - 移除函数

javascript - 如果元素不是对象,则获取嵌套 JSON 对象的键名称和值

javascript - 从 Node.JS/Javascript 页面的标签栏中删除图像

javascript - 字符串中每个字符的出现

php - 我想将终端错误写入日志文件 - LUMEN

php - 如何在一定数量后打破表格元素?

php mysql 查询未正确执行

javascript - 在 $(document).ready 上添加 KO "data-bind"属性

JavaScript XML 解析

jquery - 拖放在 fullCalendar 中不起作用