从一页平滑滚动到另一页的特定部分

Question

我建立了一个网站，其中主页有一个联系表单部分，而其他页面没有。使用 Jquery，我确保当用户单击主页导航栏中的联系链接时，页面将向下滚动到联系表单部分。假设用户在“关于我们”页面并单击联系链接，我希望网站将用户带回主页并向下滚动到联系表单部分。可以吗？？

感谢您的回答。

Answer 1

您可以使用下面的 id 和滚动函数脚本轻松向下滚动到目标。

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

    if (this.hash !== "") {
      // Prevent default anchor click behavior
      event.preventDefault();

      var hash = this.hash;

      $('html, body').animate({
        scrollTop: $(hash).offset().top
      }, 800, function(){

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

您可以使用以下语法使用 # 和 href 向下滚动到您需要的部分

<a href="#section_target">Click Me to Smooth Scroll to Section Below</a>

如果您想定位其他页面中的部分，只需使用链接后跟目标部分 ID

<a href="index.html#section_target">Take to target section in homepage</a>

定位 URL 以及 部分 ID

希望这就是你要找的……