Анимация прокрутки ссылки привязки работает только после обновления (JQuery) в Squarespace - PullRequest
Новая
       67

Анимация прокрутки ссылки привязки работает только после обновления (JQuery) в Squarespace

0 голосов
/ 30 октября 2019

В настоящее время я создаю веб-сайт 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>

Ответы [ 2 ]

1 голос
/ 30 октября 2019

трудно определить без ссылки, но это может быть гонка между javascript и встроенным механизмом href для тега.

вы можете попробовать заменить

$ ('a [href* = #]: нет ([href = #]) '). click (function () {

с

$ (' a [href * = #]: нет ([href = #]) '). click (function (e) {e.preventDefault ();

0 голосов
/ 30 октября 2019

Описанная вами проблема вызвана AJAX-загрузкой в ​​Squarespace . Вы можете просмотреть возможные решения на этот ответ на очень похожий вопрос . Проще говоря, вы можете отключить AJAX или изменить свой код, чтобы он работал с ним, оба из которых упомянуты в вышеупомянутых ссылках.

...