Question

我想在单击箭头后从下向上滚动页面。

var $arrow = $("#arrow a");
$("#arrow").on("click", function() {
  $("body,html").animate({
    scrollTOP: 400
  }, 1000)
})

<header>
  <div id="arrow">
    <i class="fa fa-angle-down" aria- hidden="true"></i>
  </div>
  <!-- na Youtubie jest + aria-hidden="true"-->
</header>
<main></main>

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

显示错误：

'$'在定义之前被使用。 var $ arrow = $（“＃arrow a”）;
  缺少“严格使用”声明。 $（“ body，html”）。animate（{
  预期为“；”而是看到了“}”。 }，1000）
  预期为“；”而是看到了“（结束）”。 }）

Answer 1

尝试不使用动画进行关注

$("#arrow").on("click", function() {
 $(document).scrollTop($(document).scrollTop() + " px");
})

Answer 2

var $arrow = $("#arrow a");
$("#arrow").on("click", function() {
  $("body,html").animate({
    scrollTop: 400
  }, 1000)
})

<header>
  <div id="arrow">
    <i class="fa fa-angle-down" aria-hidden="true">Go</i>
  </div>
  <p>1</p>
  <p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p>
  <!-- na Youtubie jest + aria-hidden="true"-->
  <p>2</p>
</header>
<main>
</main>

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

以上代码有效。请注意，使用scrollTop代替scrollTOP

单击箭头后滚动页面

2 个答案: