Javascript scrollTo срабатывает только при полной перезагрузке страницы

Question

Javascript scrollTo срабатывает только при полной перезагрузке страницы

0

Я отказался от этого, похоже, сделал все и последовал практически каждой ссылке в Интернете, искал исправление, но безуспешно.

Я использую scrollTo() jquery scrollTo() и localScroll() для анимации прокрутки на нескольких страницах моего сайта на anchors/id. Проблема в том, что она только прокручивается с анимацией, когда страница либо полностью перезагружается в браузере, либо просматривается напрямую через ее URL-адрес (так же, как полная перезагрузка). Если вы следуете ссылке на страницу с помощью навигации, scrollTo(), плагин не работает, и вместо этого он переходит к привязкам (поведение по умолчанию).

$(document).ready(function(){
$('.home .col-xs-6').localScroll();
    $('.tour .btn-group').localScroll();
});

Javascript загружается в файл, который отображается в HEAD (я проверил), и я также попытался поместить вышеуказанный код непосредственно на страницу, где есть ссылки.btn-group, но она по-прежнему работает только каждый раз на полном обновлении браузера, и, как я уже сказал, при переходе на страницу, содержащую вышеуказанный код, используя навигацию по сайту, она возвращается к поведению по умолчанию.

Я также попытался изменить ready функцию on('load') которая ничего не сделала, и я включил preventDefault(); что тоже не помогло.

Это кажется таким простым, но я не могу заставить его работать правильно!

Jon Girard 11 дек. 2013, в 04:12

Источник

0

Эта проблема возникает, когда у вас есть хэш в вашем URL, например yourwebsite.com/coolpage#thispart ? Или даже если вы используете обычный URL-адрес, например yourwebsite.com/othercoolpage
RustyToms 11 дек. 2013, в 03:11
0

@RustyToms проблема возникает, даже когда URL-адрес находится на корневом уровне, с или без #hash, присоединенного в конце. Я думаю, что это на самом деле как-то связано с турболинками в рельсах, я смотрю на это.
Jon Girard 11 дек. 2013, в 03:15

Теги:

javascript

jquery

ruby-on-rails

1 ответ

Ещё вопросы

Эта проблема возникает, когда у вас есть хэш в вашем URL, например yourwebsite.com/coolpage#thispart ? Или даже если вы используете обычный URL-адрес, например yourwebsite.com/othercoolpage
@RustyToms проблема возникает, даже когда URL-адрес находится на корневом уровне, с или без #hash, присоединенного в конце. Я думаю, что это на самом деле как-то связано с турболинками в рельсах, я смотрю на это.

Jon Girard · Accepted Answer · 2013-12-11T01-42-00.000Z

Таким образом, я закончил тем, что полностью убрал плагины и пошел с этим решением ниже:

$(document).on('page:load', function() {
$(".scroll").click(function(event){
         event.preventDefault();
         //calculate destination place
         var dest=0;
         if($(this.hash).offset().top > $(document).height()-$(window).height()){
              dest=$(document).height()-$(window).height();
         }else{
              dest=$(this.hash).offset().top;
         }
         //go to destination
         $('html,body').animate({scrollTop:dest}, 1500,'swing');
     });
});

который работает. Мне просто нужно добавить scroll в класс ссылок. Я считаю, что часть проблемы связана с камнем turbolinks в рельсах, поэтому я добавил функцию page:load которая заставила ее работать. К сожалению, даже с добавленной функцией, у localScroll() все еще были проблемы, но похоже, что это работает так же хорошо.