JavaScript метод scrollTo ничего не делает?
Так что я отчаянно пытаюсь заставить некоторые функции прокрутки работать на странице. После того, как мне не повезло, я решил просто вставить window.scrollTo(0, 800); на своей странице, чтобы посмотреть, смогу ли я получить прокрутку. Ничего не происходит У меня есть аккордеон, который расширяется, и затем я хочу прокрутить до определенного элемента с ним. Но сейчас я был бы рад увидеть прокрутку. Кто-нибудь сталкивался с этим?
Спасибо!
12 ответов
Мне удалось решить эту проблему, используя метод jQuery animate (). Вот пример реализации, с которой я пошел:
$('#content').animate({ scrollTop: elementOffset }, 200);
Селектор получает div с ID = "content". Затем я применяю метод animate к нему с опцией scrollTop. Второй параметр - это время в миллисекундах для продолжительности анимации. Я надеюсь, что это поможет кому-то еще.
Иногда это не просто проблема css, для меня это был браузер. Я должен был решить это с помощью этого кода.
if ('scrollRestoration' in window.history) {
window.history.scrollRestoration = 'manual'
}
Это позволяет разработчику взять на себя ответственность за изменения прокрутки. Подробнее об этом здесь
Если у вас есть что-то вроде этого:
html, body { height: 100%; overflow:auto; }
Если определение body и html имеет определение высоты 100%, а также включена прокрутка, window.scrollTo (и все производные механизмы прокрутки) не работают, несмотря на отображаемую полосу прокрутки (которая может использоваться пользователем), когда содержимое превышает этот 100% роста. Это потому, что полоса прокрутки, которую вы видите, - это не окно, а тело.
Решение:
html { height: 100%; overflow:auto; }
body { height: 100%; }
У меня была такая же проблема. Окно фокусировки до прокрутки работало на меня.
window.focus();
window.scrollTo(0,800);
Проверьте, нет ли у вашего тега места, где находится ваш свиток, переполнение CSS [/ - x-y]: скрыто. это исправило ошибку
Когда
window.scrollTo(x,y)не работает на консоли браузера, и дом отображается после прокрутки, вы можете использовать это.
Для прокрутки на Splash или на любом сервисе рендеринга JavaScript выполните ниже js:
document.body.style.height = "2000px";
window.scrollTo(0,2000);
В Splash вы можете сделать что-то похожее на это:
assert(splash:wait(10))
assert(splash:runjs("document.body.style.height = '2000px';"))
assert(splash:runjs("window.scrollTo(0,2000);"))
assert(splash:wait(2))
assert(splash:runjs("window.scrollTo(0,0);"))
У меня была такая же проблема сегодня, а затем я обнаружил, что когда я вынул автоматически сгенерированный блок doctype:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
window.scrollTo (0,800) начал работать вместе с ExtJs scrollTo () Функция, которую я изначально пытался использовать. Я поставил блок обратно, и он перестал работать. Я не знаю, сталкивался ли ты с этим (2 года назад), но, надеюсь, это поможет кому-то еще столкнуться с той же проблемой.
Ну, очевидно, он не будет прокручиваться, если ваша страница по крайней мере (viewport.height - 800) высотой. Вы видите полосу прокрутки? В противном случае вы делаете что-то еще не так.
Во-первых, достаточно ли большая страница для прокрутки (даже если она в фрейме)? Если нет, или вы не уверены, сделайте гигантский div, затем поместите что-нибудь под ним. Попробуйте перейти к этому.
Далее, если вы прокручиваете в iframe, поместите ваш код на ту же страницу, что и источник фрейма. Таким образом, вам не нужно беспокоиться о получении документа или конкретного элемента в другом окне, что может быть сложно. Ах да, ты уверен, что правильно понял эту часть? В этом вам поможет Firebug.
Наконец, установите точку останова (используя Firebug) на строке, которая должна вызывать прокрутку. Это достигло той точки останова? Если нет, ваш код не выполняется, и прокрутка не является вашей проблемой.
(Я ответил на это, поддерживая контекст из вашего предыдущего вопроса .)
РЕДАКТИРОВАТЬ:
Прокрутка выполняется окно за окном. Если вы находитесь в кадре, который не может прокрутить, то ничего не будет прокручиваться. Если вы хотите, чтобы этот элемент в кадре был прокручен, получите смещение этого элемента к его текущему окну и добавьте его к смещению содержащего фрейма. Это должно сработать.
Я исправил эту проблему с помощью setTimout. Я использовал angularjs, но, возможно, это поможет и ванильным js.
setTimeout(function () {
window.scrollTo(0, 300);
},2);
Возьмите этот код: http://www.java2s.com/Code/JavaScriptReference/Javascript-Methods/scrollToExample.htm и сохраните как HTML-файл. Обратите внимание, что он жестко кодирует очень большой div больше, чем область просмотра браузера. Вам, вероятно, нужно добавить контент внизу страницы, чтобы прокрутка работала.
Это вчера произошло со мной, потому что я имел overflow: auto на отделении, которое было ребенком к <html> и <body>.
, Таким образом, я узнал, что, чтобы window.scrollTo() работал, Вы должны иметь overflow: auto (или что бы то ни было, overflow-y: scroll) набор на <html> элемент.
я узнал, что, чтобы document.body.scrollTo() работал, Вы должны иметь overflow набор на [1 110].
я узнал, что можно также использовать его на любом другом элементе (если Вы хотите), использование document.querySelector('#some-container').scrollTo().
В моем случае, я хотел
window.scrollTo()работать, таким образом, я поместил водосливный CSS на [1 113].
я удивлен никакие другие ответы в здесь разговоре о "точно, который" элемент с возможностью прокрутки. Корневой элемент HTML должен быть с возможностью прокрутки, чтобы window.scrollTo() работал. Все мои дочерние элементы в нисходящем направлении [1 115] установлены на [1 116].
Мой CSS похож на это:
html { position: absolute; left: 0; top: 0; right: 0; bottom: 0; overflow: auto; }
body { width: 100%; height: auto; }
#app { width: 100%; height: auto; }