готов (функция () не работает должным образом

Question

Я использую эту функцию jquery до для прокрутки в div, идущий по ссылке в индексе ;когда я выполняю действие (нажимая на ссылку, чтобы перейти на дополнительную страницу) и выполняется прокрутка, она работает, но не с правильным измерением «scrollTop».

Я понимаю, что оно работает правильно, пока я не перезагружаюсьстраница.Я не знаю, правильно ли я использую функцию.

var locationString = window.location.hash;
var headerHeight = -70;

$(document).ready(function(){
     var divLoc = $(locationString).offset();
     console.log(locationString, divLoc.top , divLoc.top + headerHeight);
     $('html, body').animate({scrollTop: divLoc.top + headerHeight}, "slow");
 });

Answer 1

Наиболее распространенной причиной является неправильное понимание двух событий, связанных с загрузкой страницы: $(document).ready() (все элементы DOM готовы к запросу / изменению или что-либо еще) и $(window).load() (все изображения и связанные cssготово, и страница будет отображена и будет полностью отображаться браузером).

Если вы используете $(document).ready() для применения действий, которые требуют загрузки всей страницы для корректного отображения всех размеров, произойдет сбойпотому что изображения еще не загружены, поэтому вертикальные смещения (как в вашем случае) могут быть неправильно рассчитаны.

Поэтому вам нужно использовать $(window).load() вместо этого, поэтому при переходе к элементу вы убедитесь, чточто страница полностью отрисована и все элементы будут размещены так, как они должны быть.

Надеюсь, это поможет.