Скролл к якорю с учетом выстоты меню?

Question

[NewUser4242]

Может кто знает скрипт, что бы при скроле к якорю учитывалась высота меню(оно всегда 120px) и должен работать при переходе с других страниц. Спасибо

Comments

[Андрей Иванов]

А как это щас работает ?

[NewUser4242]

Андрей Иванов, Сейчас просто скролит, и меню немного перекрывает блок

Answer 1

[Andrey Vasilev]

google - 5 sek
дописать "120" - 2 sek
result = 7 sek

<script>
$("#callme").click(function() { // ID откуда кливаем
    $('html, body').animate({
        scrollTop: $(".formwrap").offset().top + 120  // класс объекта к которому приезжаем
    }, 1000); // Скорость прокрутки
});
</script>

p.s. при переходе просто запускай скрипт без кликов

Comments

[NewUser4242]

У меня множество кнопок. // ID откуда кливаем не можу вручную прописать. +Как сказал переход может быть с другой страницы а тогда этот скрипт не сработает

[Andrey Vasilev]

NewUser4242, чувак, ты гонишь?

$(document).on("ready", function() {
$('html, body').animate({
        scrollTop: $(".formwrap").offset().top + 120  // класс объекта к которому приезжаем
    }, 1000); // Скорость прокрутки
});

[Andrey Vasilev]

NewUser4242, пиши код прямо на странице, на которой нужен скролл и всё

[NewUser4242]

Andrey Vasilev, .formwrap это что? Мне не к одному блоку нужно скролить. В меню каждая кнопка за другой блок отвечает. Чувак ты гонишь?

[Andrey Vasilev]

NewUser4242, .formwrap - это либо класс, либо айди блока, к которому нужен скролл

[Andrey Vasilev]

NewUser4242,

$("#callme").click(function() // #callme - класс или айдишник для клика > скролла

[NewUser4242]

Ты понимаешь? У меня есть 10 разнык кнопок и 10 разных блоков. А то и больше. Я не могу каждый раз прописать это все. +Когда с другой страницы переходить события клика не отследить, так как кликали на другой странице

[Andrey Vasilev]

NewUser4242, так ты повесь на нужной странице и при переходе на неё отработает:

$(document).on("ready", function() {
$('html, body').animate({
        scrollTop: $(".formwrap").offset().top + 120  // класс объекта к которому приезжаем
    }, 1000); // Скорость прокрутки
});

и сразу проскролит куда надо.
как только документ подгрузится сразу будет скролл, не нужно никуда ничего вешать, только на нужную страницу и ВСЁ

[Andrey Vasilev]

NewUser4242, если тебе нужно на нескольких страницах - вынеси в script.js и добавь на каждой странице нужный класс для скролла

[NewUser4242]

Я не могу прописать // класс объекта к которому приезжаем их множество

[Andrey Vasilev]

NewUser4242, господи, у тебя что: как только пользователь заходит на страницу - ты летишь ему 10 экранов показывать?

[NewUser4242]

Если не понимаешь зачем писать? У меня кнопок больше 10. Я не буду скрипт 10 раз переписывать, что бы прописать 10 разных блоков.

[Andrey Vasilev]

NewUser4242, ты тупой? (+бан)
У ВСЕХ КНОПОК ПОСТАВЬ ОДИНАКОВЫЙ КЛАСС И ЗАКИНЬ СКРИПТ В ОБЩИЙ ФАЙЛ

[NewUser4242]

Andrey Vasilev, Если есть клик. Он на другой странице произошёл. Тогда когда будет новая открыта высоту учитывать не будет так как клика на этой странице не произошло

[Andrey Vasilev]

NewUser4242, https://codepen.io/Nolis/pen/NWNLaGB ВАРИАНТ С ЛЮБОЙ КНОПКОЙ
НА ЛЮБОЙ СТРАНИЦЕ ПРИ ЗАГРУЗКЕ https://codepen.io/Nolis/pen/wvGErGX

[Andrey Vasilev]

NewUser4242, если тебе конкретно что-то нужно запомнить https://developer.mozilla.org/en-US/docs/Web/API/W...

[NewUser4242]

Я на пальцах объясню. Нельзя статически указывать ни кнопку по которой клик, ни блок к которому скролл. Я понятно объяснил?

[Andrey Vasilev]

NewUser4242, бля ну напряги хоть одну извилин
сделай все по секциям и скроль к ним или ещё какой вариант

[NewUser4242]

Andrey Vasilev, Хорошо, вы очень хороший специалист. Вы мне очень помогли, спасибо вам)

Answer 2

[Pashok Doom]

function sticky__link(target) {
	$('html, body').animate({scrollTop: $('#' + target).offset().top}, 600);
	return true;			
}
function getURLAncors() {
	var e=[],s=document.location.href.split("#");
	if (s[1] && $('#' + s[1])[0]) {
		sticky__link(s[1]);
	}
}
$(document).ready(function(){
getURLAncors();
})

Comments

[NewUser4242]

Ноль результата как скролило так и скролит

[Pashok Doom]

// замени $('#' + target).offset().top на 
$('#' + target).offset().top - $('.menu').height()

В идеале пример покажи

[NewUser4242]

function sticky__link(target) {
$('html, body').animate({scrollTop: $('#' + target).offset().top - $('.menu').height()}, 600);
return true;
}
function getURLAncors() {
var e=[],s=document.location.href.split("#");
if (s[1] && $('#' + s[1])[0]) {
sticky__link(s[1]);
}
}
$(document).ready(function(){
getURLAncors();
})
Вместо .menu свой класс прописал. Все равно ничего