Блог

Главная - Вопросы по программированию - Jquery scrolltop не будет работать со смещением

Jquery scrolltop не будет работать со смещением

#jquery #html #css

#jquery #HTML #css

Вопрос:

Привет, у меня небольшая проблема с jQuery, когда функция запускается в первый раз, она, похоже, не замечает -60 пикселей для моего липкого заголовка. После этого он отлично работает, я понятия не имею, что не так.

Вы можете проверить это сами здесь http://test.peekmanagement.com /

     $("#link_to_services").click(function() {
        $('html, body').animate({
            scrollTop: $("#services").offset().top - 60
        }, 2000);
    });

Комментарии:

1. это не только в первый раз, в следующий раз, если вы прокрутите страницу вверх до самой начальной точки и попытаетесь прокрутить вниз, пока Services не появится ссылка, при нажатии на нее все равно будет отображаться проблема.

Ответ №1:

Как я предлагаю в комментарии, попробуйте что-то подобное (не настоящий js, а на «метаязыке», просто для объяснения):

      $('<div class="replaced-container" />')
        .height($actualHeader.height())
        .width($actualHeader.width())
        .appendTo($actualHeaderContainer);

И при прокрутке страницы:

     if (pageScrollTop is > of the firstScene) {
       $('.replaced-container').show();
    } else {
     $('.replaced-container').hide();
    }

Комментарии:

1. Нет проблем, как только я смогу, мне удастся закодировать скрипку для объяснения.

2. Привет, на самом деле у меня не было времени, извините.

Ответ №2:

Попробуйте вызвать функцию в $(window).load, а не при готовности документа.

Комментарии:

1. Я понимаю проблему: поскольку заголовок становится «липким», поскольку он исправлен, вычисляемое значение offset().top неверно. Вы должны обернуть заголовок в дополнительный div или просто добавить ‘replaced-container’ и установить для него фактическую высоту и ширину заголовка с помощью метода jQuery, чтобы на странице каждый элемент не влиял на отсутствие высоты фиксированного заголовка, потому что на самом деле высота заголовка неизменение. Итак, когда страница закрывается, заголовок становится «липким», а смещение всех элементов остается неизменным. Кроме того, у меня есть проверка в вашем коде, и его нужно немного реорганизовать…