Просмотр полной версии : Не работает плавная прокрутка к якорю после загрузки страницы
emptyindorill
25.07.2016, 10:39
Здравствуйте. Для плавной прокрутки к якорю после загрузки страницы использую вот это:
window.hashName = window.location.hash;
window.location.hash = '';
$(window).load(function () {
$('html, body').animate({scrollTop: $(window.hashName).offset().top}, 2000);
return false;
});
А консоль выдаёт мне ошибку Uncaught TypeError: Cannot read property 'top' of undefined.
Использую jquery-2.2.0.min.js
Я только-только начинаю учить javascript, посмотрел в гугле варианты ошибок - но так ничего и не понял. Подскажите пожалуйста - в чём может быть дело?
window.hashName = window.location.hash; - Что это такое?:blink:
Uncaught TypeError: Не удается прочитать свойство 'top' не определено.
$(window.hashName).offset().top
emptyindorill
25.07.2016, 11:20
Как я понял (тут взял (http://ru.stackoverflow.com/questions/411152/%D0%9F%D1%80%D0%BE%D0%BA%D1%80%D1%83%D1%82%D0%BA%D 0%B0-%D0%BA-%D1%8F%D0%BA%D0%BE%D1%80%D1%8E-%D0%B8%D0%B7-url-%D1%81%D1%82%D1%80%D0%B0%D0%BD%D0%B8%D1%86%D1%8B-%D0%BF%D1%80%D0%B8-%D0%B7%D0%B0%D0%B3%D1%80%D1%83%D0%B7%D0%BA%D0%B5)) это проверка на наличие прокручиваемого тэга.
нет такого элемента на странице и свойство что вы считываете нет. Можно html страницы на которой этот скрипт работает.
emptyindorill
25.07.2016, 12:13
Что-то я вообще перестал понимать( Я забыл указать что у меня указан якорь - window.location.hash = '#anchor';
И прокрутка происходит, но не плавно а скачком - тут (http://epicwriting.ru/zagolovok-cursa.html).
Ошибка та же - как тогда сделать что бы плавная прокрутка была?
Скрипт находится после футера.
window.location.hash = '';
$(window).load(function () {
$('html, body').animate({scrollTop: $('#anchor').offset().top}, 2000);
return false;
});
Так тоже не работает?
emptyindorill
25.07.2016, 13:12
Переход на якорь есть а плавности нету.
И то если так - window.location.hash = '#anchor';
Так тоже не работает?
верните страницу вверх перед load.
window.scrollTo(0,0);
$(window).load(function () {
$('html, body').animate({scrollTop: $('#anchor').offset().top}, 2000);
return false;
});
emptyindorill
25.07.2016, 14:01
верните страницу вверх перед load.
window.scrollTo(0,0);
$(window).load(function () {
$('html, body').animate({scrollTop: $('#anchor').offset().top}, 2000);
return false;
});
Блин, и это не работает.
emptyindorill,
значит нет jquery или уже нет
попробуйте заменить все $ на jQuery
emptyindorill
25.07.2016, 14:18
Uncaught TypeError: Cannot read property 'top' of undefined
У меня тут подключены ещё 2 библиотеки - Эта (http://epicwriting.ru/assets/templates/epicwriting/js/scroll_top.js) и эта (http://epicwriting.ru/assets/components/ajaxform/js/default.js). У меня тут ещё есть не работающий скрипт кнопки наверх.
Самое интересное что есть html (https://drive.google.com/file/d/0B0r3VzcjfmghSDZxTzZHc0lHOTg/view) с этими же подключёнными библиотеками и там всё работает, а тут нет оО
emptyindorill
25.07.2016, 19:15
Получилось!
function scroll_to_elem(selector) {
jQuery(selector).on('click', function (e) {
e.preventDefault();
var scroll_el = jQuery(this).attr('href');
scroll_el = scroll_el.replace(/_/g, '');
if (jQuery(scroll_el).length != 0) {
jQuery('html, body').animate({scrollTop: jQuery(scroll_el).offset().top}, 500);
}
return false;
});
}
function scroll_to_hash() {
jQuery('html, body').animate({scrollTop: jQuery('#anchor').offset().top}, 500);
}
jQuery(window).load(function () {
scroll_to_hash();
scroll_to_elem("[href^='#_']");
});
vBulletin® v3.6.7, Copyright ©2000-2025, Jelsoft Enterprises Ltd. Перевод: zCarot