Почему не работает функция scrollTo?
Ребята, чисто для интереса балуюсь разными фичами, и столкнулся с тем, что что на простой HTML странице не работает scrollTo(x, y). У меня не задана высота страницы height по умолчанию auto. Но, если я в css файле прописываю к body, к примеру, height: 1000px;, то всё отлично работает, есть прокрутка страницы вниз на заданный интервал. Вопрос: Разве для scrollTo() нужно указывать высоту body, а без этого она не работает?
- Вопрос задан более трёх лет назад
- 745 просмотров
Разве для scrollTo() нужно указывать высоту body, а без этого она не работает?
Если у Вас нет полосы прокрутки, то прокрутка «сработает», но визуально от этого ничего не изменится.
По моему, ещё прокрутку желательно делать и для BODY и для HTML одновременно, т.к. в каких-то баузерах, с этим были проблемы. Возможно информация уже не актуальна.
есть прокрутка страницы вниз на заданный интервал.
Romantic: вот и ответ на Ваш вопрос (который кстати я уже выше писал). Если нет полосы прокрутки — то метод ScrollTo() — не растянет элемент HTML/BODY на 100% высоты и не добавит к этому значению ещё +50px (50px — для примера), что бы страница стала скроллится на 50px вниз.
Или, давайте попробую объяснить по другому. Когда Вы колёсиком мыши пытаетесь проскроллить страницу, у которой нет полосы прокрутки — происходит «ничего». ScrollTo() в данном случае работает аналогично колёсику мыши. То есть, если страница не скроллится, это не значит, что колёсико мыши не работает, это значит что скроллить её просто некуда 🙂
Аналогичная ситуация будет при использовании «якорей», при попытке перейти к якорю в конце страницы, страница проскрллится до конца, но если контент после якоря занимает высоту меньше высоты экрана — то будет просто скролл страницы в конец, и якорь будет не в самом верху страницы.
Источник
JavaScript метод scrollTo ничего не делает?
Итак, я desperatley пытается получить некоторые функции прокрутки для работы на странице. После того, как я не повезло, я решил просто прикрепить window.scrollTo(0, 800); на моей странице, чтобы увидеть, могу ли я пропустить прокрутку. Ничего не происходит. У меня есть аккордеон, который расширяется, а затем я хочу прокрутить его до определенного элемента. Но на данный момент я был бы рад просто увидеть прокрутку. Кто-нибудь сталкивается с этим?
10 ответов
Мне удалось решить эту проблему, используя метод jQuery animate(). Вот пример реализации, с которым я пошел:
Селектор получает div с . Затем я применяю метод animate на нем с scrollTop в качестве опции. Второй параметр — это время в миллисекундах для продолжительности анимации. Надеюсь, это поможет кому-то другому.
Если у вас есть что-то вроде этого:
Если оба тела и html имеют определение высоты 100%, а также включена прокрутка, window.scrollTo(и все производные механизмы прокрутки) не работают, несмотря на отображение полосы прокрутки (которая может использоваться пользователем), когда содержание превышает 100% роста. Это потому, что полоса прокрутки вы видите не в окне, а в теле.
Я исправил эту проблему с помощью setTimout. Я использовал angularjs, но, возможно, это может помочь и в vanilla js.
Иногда это не просто проблема css, для меня это был браузер. Я должен был решить это с помощью этого кода.
Это позволяет разработчику взять на себя ответственность за изменения прокрутки. Подробнее об этом здесь
У меня была такая же проблема сегодня, а затем я обнаружил, что когда я вынул автоматически созданный блок doctype:
Window.scrollTo(0,800) начал работать вместе с функцией ExtJs scrollTo(), которую я изначально пытался использовать. Я вернул блок и перестала работать. Я не знаю, было ли это то, с чем вы сталкивались (2 года назад), но, надеюсь, это помогает кому-то другому столкнуться с одной и той же проблемой.
проверьте, не помечен ли ваш тег, где вы подключены, прокрутка CSS переполнения [/- x-y]: скрыто. он исправил ошибку
Когда window.scrollTo(x,y) не работает на консоли браузера, и dom визуализируется после прокрутки, вы можете использовать это.
Для прокрутки на Splash или любом другом сервисе рендеринга JavaScript выполните ниже js:
В Splash вы можете сделать что-то похожее на это:
Во-первых, ваша страница достаточно велика для прокрутки (даже если она в iframe)? Если нет, или вы не уверены, сделайте гигантский div, а затем положите что-то ниже. Попробуйте прокрутить к нему.
Затем, если ваша прокрутка в iframe, поместите свой код на ту же страницу, что и источник кадра. Таким образом, вам не нужно беспокоиться о том, чтобы получить документ или конкретный элемент в другом окне, что может быть сложно. О да, ты уверен, что правильно понял эту часть? Переход с помощью Firebug может помочь вам в этом.
Наконец, поставьте точку останова (используя Firebug) в строке, которая должна вызвать прокрутку. Он попал в точку останова? Если нет, ваш код не выполняется, и прокрутка не является вашей проблемой.
(Я ответил на это, поддерживая контекст из вашего предыдущего вопроса.)
Прокрутка выполняется окном по окну. Если вы находитесь в кадре, который не может прокручиваться, ничто не будет прокручиваться. Если вы хотите, чтобы этот элемент в кадре был прокручен, получите смещение этого элемента в его текущее окно и добавьте его к смещению содержащего фрейма. Это должно сделать трюк.
Источник
Прокрутите автоматически до нижней части страницы
Считай, у меня есть список вопросов. Когда я нажимаю на первый вопрос, он автоматически переводит меня в конец страницы.
На самом деле, я знаю, что это можно сделать с помощью jQuery.
Итак, не могли бы вы предоставить мне некоторую документацию или ссылки, где я могу найти ответ на этот вопрос?
РЕДАКТИРОВАТЬ: необходимо прокрутить до определенного элемента HTML в нижней части страницы
21 ответ
JQuery не является необходимым. Большинство главных результатов, которые я получил от поиска Google, дали мне этот ответ:
Там, где у вас есть вложенные элементы, документ может не прокручиваться. В этом случае вам нужно нацелиться на элемент, который прокручивается, и вместо этого использовать его высоту прокрутки.
Вы можете связать это с onclick событием вашего вопроса (т.е.
Некоторые дополнительные источники, на которые вы можете взглянуть:
Очень простой способ
Вызывайте эту функцию, когда хотите прокрутить вниз.
Столько ответов пытается вычислить высоту документа. Но это не правильно для меня. Тем не менее, оба из них работали:
Иногда страница распространяется при прокрутке вниз (например, в социальных сетях), чтобы прокрутить вниз до конца (конечная нижняя часть страницы), я использую этот скрипт:
И если вы находитесь в консоли javascript браузера, может быть полезно иметь возможность остановить прокрутку, поэтому добавьте:
А затем используйте stopScroll(); .
Если вам нужно прокрутить до определенного элемента, используйте:
Или универсальный скрипт для автопрокрутки до определенного элемента (или остановки интервала прокрутки страницы):
Вы можете сделать это тоже с анимацией, это очень просто
Надежда помогает, спасибо
Для прокрутки вниз в Selenium используйте код ниже:
До нижнего выпадающего списка прокрутите до высоты страницы. Используйте приведенный ниже код JavaScript, который будет хорошо работать как в JavaScript, так и в React.
Это будет гарантированная прокрутка вниз
Головные коды
Код тела
Если вы хотите прокрутить всю страницу до конца:
Если вы хотите прокрутить элемент до конца:
И вот как это работает:
ОБНОВЛЕНИЕ . Последние версии Chrome (61+) и Firefox не поддерживают прокрутку тела, см. https://dev.opera.com/articles/fixing-the-scrolltop-bug/
Вы можете использовать эту функцию везде, где вам нужно ее вызвать:
Одна картинка стоит тысячи слов:
Он использует document.documentElement , который является элементом . Это похоже на использование window , но я лично предпочитаю делать это таким образом, потому что если это не вся страница, а контейнер, она работает точно так же, за исключением того, что вы изменили <
Примере:
Вы можете сравнить разницу, если нет scrollTo() :
Один вкладыш для плавной прокрутки вниз
Для прокрутки вверх просто установите top на 0
Вы можете попробовать Gentle Anchors хороший плагин для JavaScript.
Пример:
Тестирование на совместимость:
- Mac Firefox, Safari, Opera
- Windows Firefox, Opera, Safari, Internet Explorer 5.55+
- Linux не тестировался, но с Firefox должен быть как минимум
Поздно к вечеринке, но вот простой код только для javascript для прокрутки любого элемента вниз:
Если кто-то ищет Angular
Вам просто нужно прокрутить вниз, чтобы добавить это к вашему div
1e10 — это большое число. так что это всегда конец страницы.
Вы можете использовать это, чтобы перейти вниз по странице в формате анимации.
Реализация Vanilla JS:
Ниже должно быть кросс-браузерное решение. Он был протестирован на Chrome, Firefox, Safari и IE11
Window.scrollTo ( 0 , document.body.scrollHeight ) ; не работает в Firefox, по крайней мере для Firefox 37.0.2
Вы можете присоединить любой id к ссылочному атрибуту href элемента ссылки:
В приведенном выше примере, когда пользователь нажимает Click me внизу страницы, навигация переходит к самому Click me .
Источник
Не работает scroll
На всех других своих сайтах пробовал все работает.Тут вот такая ошибка
Uncaught TypeError: Failed to execute ‘scroll’ on ‘Window’: 2 arguments required, but only 1 present.
Помощь в написании контрольных, курсовых и дипломных работ здесь.
Не работает событие scroll
Здравствуйте, у меня вот такая вроде и глупая проблема но все же — Не очень часто сталкиваюсь с.
Не работает live(‘scroll’, handler)
Всем привет! Не могу заставить работать live() с событием прокрутки страницы. Может кто.
OFF scroll на body > ON scroll children
Добрый день. Возник вопрос как сделать так чтоб при на ведении на элемент событие scroll работало в.
Ни чего не забыли? Если вот так:
Возвращаюсь к Uncaught TypeError: Failed to execute ‘scroll’ on ‘Window’: 2 arguments required, but only 1 present.
Добавлено через 3 минуты
Решение
Не работает Scroll
установил xptweaker полазил в нём чёто поменял и где то там затесалась настройка скролла (чтото.
При scroll’e не пролистываются объекты, имеющие компонент scroll rect
Есть главная панель со scroll rect’ом для горизонтального scroll’а и event trigger’ом (для проверки.
Почему на мышке в VB не работает Scroll?
Подскажите, пожалуйста,начинающему программисту почему на мышке в VB не работает Scroll? Это.
Приветствую всех! Прошу всех прочитавших мне помочь. Постараюсь вкратце обьяснить: Нашел на неком.
Источник
JavaScript метод scrollTo ничего не делает?
Поэтому я отчаянно пытаюсь заставить некоторые функции прокрутки работать на странице. После того, как не повезло, я решил просто придерживаться window.scrollTo(0, 800); на моей странице, чтобы посмотреть, смогу ли я получить прокрутку. Ничего не происходит У меня есть аккордеон, который расширяется, и затем я хочу прокрутить до определенного элемента с ним. Но сейчас я был бы рад увидеть прокрутку. Кто-нибудь сталкивался с этим?
20 ответов
Я смог решить эту проблему с помощью метода jimate(). Вот пример реализации, с которой я пошел:
Селектор получает div с . Затем я применяю метод animate к нему с опцией scrollTop. Второй параметр — это время в миллисекундах для продолжительности анимации. Я надеюсь, что это помогает кому-то еще.
Если у вас есть что-то вроде этого:
Если и body, и html имеют определение высоты 100%, а также включена прокрутка, window.scrollTo (и все производные механизмы прокрутки) не работают, несмотря на отображаемую полосу прокрутки (которая может использоваться пользователем), когда содержимое превышает что 100% роста. Это потому, что полоса прокрутки, которую вы видите, — это не окно, а тело.
Я исправил эту проблему с помощью setTimout. Я использовал angularjs, но, возможно, это поможет и ванильным js.
Иногда это не просто проблема css, для меня это был браузер. Я должен был решить это с помощью этого кода.
Это позволяет разработчику взять на себя ответственность за изменения прокрутки. Подробнее об этом здесь
Это случилось со мной вчера, потому что у меня было overflow: auto на div, который был дочерним элементом а также .
Так я узнал это для window.scrollTo() чтобы работать, ты должен иметь overflow: auto (или что угодно, overflow-y: scroll ) установлен на элемент.
Я узнал это для document.body.scrollTo() чтобы работать, ты должен иметь overflow установлен на .
Я узнал, что вы также можете использовать его для любого другого элемента (если хотите), используя document.querySelector(‘#some-container’).scrollTo() .
В моем случае я хотел window.scrollTo() работать, поэтому я включил CSS переполнения .
Я удивлен, что никакие другие ответы здесь не говорят о том, «какой именно» элемент прокручивается. Корневой элемент html должен быть прокручиваемым для window.scrollTo() работать. Все мои дочерние элементы ниже по течению установлены на height: auto .
У меня была такая же проблема. Окно фокусировки до scrollTo работало для меня.
У меня была такая же проблема сегодня, а потом я обнаружил, что когда я вынул автоматически сгенерированный блок doctype:
Window.scrollTo(0,800) начал работать вместе с функцией ExtJs scrollTo(), которую я изначально пытался использовать. Я поставил блок обратно, и он перестал работать. Я не знаю, с чем вы столкнулись (2 года назад), но, надеюсь, это поможет кому-то еще столкнуться с той же проблемой.
Это то, что я делаю в React, поскольку у меня есть корневой элемент, как первый и самый внешний div на моей странице, я прокручиваю его до верхней части.
For me setting the height of html and body to auto did the trick.
У меня была эта проблема, и она не имела ничего общего с этими ответами. Проблема для меня впервые появилась после обновления до Bootstrap 4, который преобразовал многие мои div в display: flex . Оказывается, JQuery scrollTop() не так хорошо работает с гибкими макетами.
Решением для меня было изменить мой старый код с:
Единственная разница заключается в добавлении «html» перед div, который нужно прокручивать.
Реквизит к этой проблеме за то, что помог мне разобраться.
Проверьте, что ваш тэг, где подключен ваш прокрутки, получает переполнение CSS [/-xy]: скрыто. это исправило ошибку
document.body.scrollTo(0, 800) Это решило мою проблему.
Использование свойства onunload сработало для меня
Если прокрутка была выполнена после скольжения вниз, он должен дождаться, пока div завершит анимацию, как это
В моем случае: window.scrollBy(0,200); работает.
Я не имею понятия почему window.scrollTo(0,200); не работает и window.scrollBy(0,200); работает.
Во-первых, достаточно ли большой страницы для прокрутки (даже если она в фрейме)? Если нет, или вы не уверены, сделайте гигантский div, затем поместите что-нибудь под ним. Попробуйте перейти к этому.
Далее, если вы прокручиваете в iframe, поместите ваш код на той же странице, что и источник фрейма. Таким образом, вам не нужно беспокоиться о получении документа или определенного элемента в другом окне, что может быть сложно. Ах да, ты уверен, что правильно понял эту часть? В этом вам поможет Firebug.
Наконец, установите точку останова (используя Firebug) на строке, которая должна вызвать прокрутку. Это достигло той точки останова? Если нет, ваш код не выполняется, и прокрутка не является вашей проблемой.
(Я ответил на это, поддерживая контекст из вашего предыдущего вопроса.)
Прокрутка осуществляется окно за окном. Если вы находитесь в кадре, который не может прокрутить, то ничего не будет прокручиваться. Если вы хотите, чтобы этот элемент в кадре был прокручен, получите смещение этого элемента к его текущему окну и добавьте его к смещению содержащего фрейма. Это должно делать свое дело.
Источник