Я не JS разработчик, и я использую Bootstrap для создания одностраничного сайта с якорными ссылками.
Я использую любые фрагменты кода JS, которые я найду для некоторых необходимых функций, таких как добавление плавной прокрутки к ссылкам привязки, с верхним смещением, потому что я использую фиксированное / закрепленное меню.
Хотя это одностраничный веб-сайт, я использую Конфиденциальность и Условия как отдельные страницы.
Этот код я использую для якорных ссылок на главной странице. Я думаю, что это смесь JS и jQuery. Он работает хорошо и так, как я хочу.
$('.navbar a, .smooth-scroll-contact').on('click', function(event) {
/* Make sure this.hash has a value before overriding default behavior */
if (this.hash !== "") {
/* Prevent default anchor click behavior */
event.preventDefault();
/* Store hash */
var hash = this.hash;
/* Using jQuery's animate() method to add smooth page scroll. */
$('html, body').animate({
scrollTop: $(hash).offset().top - 70
}, 800, function(){
/* Add hash (#) to URL when done scrolling (default click behavior). */
if (history.pushState) {
history.pushState(null, null, hash);
}
else {
window.location.hash = hash;
}
});
} // End if
});
Хотя он отлично работает на домашней странице, он не позволяет открывать ссылки меню на страницах конфиденциальности и условий. Он ничего не делает при нажатии на ссылки меню там. Это не go на главную страницу или любую из ссылок там.
Это ошибка, которая появляется в консоли при нажатии на ссылки меню, а также на странице конфиденциальности или условий:
Uncaught TypeError: Cannot read property 'top' of undefined
at HTMLAnchorElement.<anonymous> (custom.js:39)
at HTMLAnchorElement.dispatch (jquery-3.4.1.min.js:2)
at HTMLAnchorElement.v.handle (jquery-3.4.1.min.js:2)
39-ая строка - scrollTop: $(hash).offset().top - 70
.
Я искал эту ошибку и пытался применить некоторые исправления, которые я нашел, но они не работали для меня, или я не знал как правильно их реализовать для этого конкретного кода.
Дополнительные примечания:
- Если я уберу код с плавной прокруткой, проблема будет решена;
custom.js
файл, в котором найден код, загружается до </body>
; - jQuery - это первый загруженный скрипт.
Если вам нужна дополнительная информация, дайте мне знать.