$(document).ready(function(){
$('body,html').scrollTop(0);
$(".menu-item").on("click","a", function (event) {
var id = $(this).attr('href'),
top = $(id).offset().top -70;
$('body,html').animate({scrollTop: top}, 1500);
});
var hash = location.hash;
if($(hash).length){
var top = $(hash).offset().top -70;
$('body,html').animate({scrollTop: top}, 1500);
}
});
/* Выше приведен код, который поможет перейти на нужный якорь при загрузке страницы или при клике на соответствующее меню.
.menu-item - класс пункта меню, на который можно кликать. Вы можете использовать любой другой класс.
*/
$(function() {
$('a[href*="#1"]:not([href="#"])').click(function() {
/*Если у вас используется Bootstrap на сайте, то нужна эта проверка. В таком случае все якоря, на которые нужно прокручиваться, должны начинаться с #1, иначе модальные окна Bootstrap не будут работать.*/
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
}, 1500);
return false;
}
}
});
});
/* Выше приведен код, который позволяет скроллить страницу к нужному якорю. Этот код будет работать только на главной странице. */
Привет! Я могу предложить использовать оба этих кода вместе, если вы хотите иметь возможность прокручивать страницу к якорям не только на главной, но и на внутренних страницах. Просто подключите файл js перед закрывающим тегом body. Этот код протестирован на WordPress и должен работать без проблем.