Question

此代码有效，它将使我自下而上，但它没有动画。有人可以帮我吗？

james@MSI:~$ source /home/james/ciao-4.11/bin/ciao.bash -o
CIAO configuration is complete...
CIAO 4.11 Wednesday, December  5, 2018
  bindir      : /home/james/ciao-4.11/bin
  CALDB       : 4.8.2
´´´

From there, everything seemed to work.

Answer 1

好，因为您似乎仍然遇到问题。您发布的代码-有效。好吧，由于您没有共享任何HTML，所以我只能假设您的确切标记和环境。

将jQuery和您的代码放在结束body标签之前。
如果需要，请使用Event.preventDefault()

工作示例：

<!DOCTYPE html>
<html>

<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width">
  <title>topScroll - example</title>
  <style>
    body { height: 300vh; }
    .topScroll { position: absolute; top: 200vh;}
  </style>
</head>

<body>

  <header id="top">
    <h1>Scroll down...</h1>
  </header>
  <a href="#top" class="topScroll">GO TO TOP</a>


  <script src="//code.jquery.com/jquery-3.1.0.js"></script>
  <script>
    $(document).on('click', '.topScroll', function(ev) {
      ev.preventDefault(); // Prevent browser doing default stuff on anchor/button click
      $("html, body").animate({scrollTop: "0px"}, 500);
    });
  </script>
  
</body>
</html>

Answer 2

您可以尝试使用微秒来降低动画速度，如下所示：

$("html, body").animate({scrollTop : "0px"},1200);

如何修复jQuery滚动顶部动画？

2 个答案: