javascript - 平滑滚动和动态页面

Question

我的网站即将完成，但现在遇到一个问题。

在我的页面上，我有 3 个带有 tekst 的 block 。 2个是静态的，一个是动态的。

当单击按钮时，页面应该发生变化，这工作正常。但现在我在我的网站上添加了平滑滚动。

平滑的滚动效果很好。但现在动态页面更改不再起作用。

我看起来好像一件事压倒了另一件事。

我该如何解决这个问题？

这是我的代码。

我已经在index.php上创建了

  <?php

      $page = 'home'; 

    $pages = array( 'home' , 'hoogopgeleid', 'kennis' , 'extern', 'uitstroom', 'dynamiek' , 'didacticum');

    if( in_array( $_GET['page'], $pages ) ) {
        $page = $_GET['page'];
    }

    ?>

对于我使用的平滑滚动(在互联网上找到)

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script>
$(function() {
  $('a[href*=#]:not([href=#])').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
        }, 1000);
        return false;
      }
    }
  });
});
</script>

在我的按钮中使用链接

<button> <a href="?page="home#pro"> Here some tekst </a>  </button>

我还在互联网上读到了有关 home#pro 的信息。但就像我说的，只有一个在工作。

我认为并希望这将是一个简单的解决方案!

谢谢

Answer 1

删除:

return false;

如这个prevents the default browser behaviour并且可能会阻止传播到您的动态内容加载器。