Javascript “平滑滚动”不适用于动画鼠标向下滚动按钮

我在我的网页上新添加了一个动画鼠标向下滚动按钮。单击按钮时，平滑滚动不起作用

注意：我已经有一个单独的按钮，用于下一部分，在那里平滑滚动可以完美地工作

动画鼠标滚动按钮activities.html：

<span class="scroll-btn"><a href="#about"><span class="mouse"><span></span></span></a><p>scroll me</p></span>

下一节活动html：

<div class="txtanim1 next-section">
   <span><a href="#about">about me <strong><i class="fa fa-question-circle"</i> 
    </strong></a></span>
    </div>

---

尝试切换到jQuery脚本

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



 $(document).ready(function(){
       // Add smooth scrolling to all links
       $("a").on('click', function(event) {

        // Make sure this.hash has a value before overriding default behavior
        if (this.hash !== "") {
          // Prevent default anchor click behavior
          event.preventDefault();

          // Store hash
          var hash = this.hash;

          // Using jQuery's animate() method to add smooth page scroll
          // The optional number (800) specifies the number of milliseconds it takes to scroll to the specified area
          $('html, body').animate({
            scrollTop: $(hash).offset().top
          }, 800, function(){

            // Add hash (#) to URL when done scrolling (default click behavior)
            window.location.hash = hash;
          });
        } // End if
      });
    });

$（文档）.ready（函数（）{
//添加平滑滚动到所有链接
$（“a”）。在（'click'，函数（事件）{
//在覆盖默认行为之前，请确保this.hash具有值
如果（this.hash！==“”）{
//防止默认锚点单击行为
event.preventDefault（）；
//存储散列
var hash=this.hash；
//使用jQuery的animate（）方法添加平滑页面滚动
//可选数字（800）指定滚动到指定区域所需的毫秒数
$（'html，body'）。设置动画({
scrollTop:$（散列）.offset（）.top
}，800，函数（）{
//完成滚动后，将哈希（#）添加到URL（默认单击行为）
window.location.hash=散列；
});
}//如果结束，则结束
});
});

         function smoothScrolling($links, $topGap) {
                var links = $links;
                var topGap = $topGap;

                links.on("click", function() {
                    if (location.pathname.replace(/^\//, '') === this.pathname.replace(/^\//, '') && location.hostname === this.hostname) {
                        var target = $(this.hash);
                        target = target.length ? target : $("[name=" + this.hash.slice(1) + "]");
                        if (target.length) {
                            $("html, body").animate({
                                scrollTop: target.offset().top - topGap
                            }, 1000, "easeInOutExpo");
                            return false;
                        }
                    }
                    return false;
                });
            }

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



 $(document).ready(function(){
       // Add smooth scrolling to all links
       $("a").on('click', function(event) {

        // Make sure this.hash has a value before overriding default behavior
        if (this.hash !== "") {
          // Prevent default anchor click behavior
          event.preventDefault();

          // Store hash
          var hash = this.hash;

          // Using jQuery's animate() method to add smooth page scroll
          // The optional number (800) specifies the number of milliseconds it takes to scroll to the specified area
          $('html, body').animate({
            scrollTop: $(hash).offset().top
          }, 800, function(){

            // Add hash (#) to URL when done scrolling (default click behavior)
            window.location.hash = hash;
          });
        } // End if
      });
    });