javascript - 使用javascript滚动到元素时添加平滑效果

Question

我编写了以下函数，每当单击某个按钮时， View 就会滚动到与“href”属性匹配的特定元素。

我想为滚动添加平滑效果。现在它只是转到元素。

<script src="/javascripts/application.js" type="text/javascript" charset="utf-8" async defer>
    $(function() {

        $(".button").on("click", function( e ) {

            e.preventDefault();

            $("body, html").animate({ 
                scrollTop: $( $(this).attr('href') ).offset().top 
            }, 600);

        });

    });
</script>

感谢任何帮助。谢谢。

Answer 1

你的代码是完美的，只需像这样编辑你的代码(见下文)。

您已写入脚本标签，该标签正在加载外部脚本文件以及内联脚本。

<script src="/javascripts/application.js" type="text/javascript" charset="utf-8" async defer> </script>
<script>
  $(function() { 
    $(".button").on("click", function( e ) { 
      e.preventDefault(); 
      $("body, html").animate({ scrollTop: $( $(this).attr('href') ).offset().top}, 600); 
    }); 
  });
</script>