锚链接滚动动画仅在刷新（JQuery）在Squarespace后起作用

Question

我目前正在建立一个Squarespace网站，我想添加带有锚链接的滚动动画。

[当前，单击锚链接将立即捕捉到页面的该部分。但是，一旦刷新，它就会开始工作。这似乎只是Chrome上的一个问题，我不太确定如何解决它，但是我非常怀疑任何访问我页面的人都不会刷新它。

我目前正在使用的代码应可一次对页面上的所有锚链接起作用。

非常感谢我能提供的任何帮助。这是代码：

<script src="//ajax.googleapis.com/ajax/libs/jquery/1/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>

Answer 1

很难知道，没有链接，但是可能是JavaScript和标记上内置的href机制之间的竞争。

您可以尝试更换

$（'a [href * =＃]：not（[href =＃]）'）。click（function（）{

with

$（'a [href * =＃]：not（[href =＃]）'）。click（function（e）{e.preventDefault（）;

Answer 2

您描述的问题与AJAX loading in Squarespace有关。您可以在this answer to a very similar question查看可能的解决方案。简而言之，您的选择是禁用AJAX或修改您的代码，以使其可以使用它，在上述链接中都提到了这两种方法。