Работает ли scrollIntoView во всех браузерах?

Ответ 1

Поддерживается да, но пользовательский интерфейс... плохой.

Как отметил @9bit, это уже давно поддерживаемое всеми основными браузерами. Не волноваться об этом. Основная проблема заключается в том, как он работает. Он просто перескакивает на определенный элемент, который также может быть в конце страницы. Подскакивая к нему, пользователи понятия не имеют:

• была прокручена страница
• страница прокручена вниз.
• они перенаправлены в другое место

Первые два могут быть определены положением прокрутки, но кто говорит, что пользователи отслеживали положение прокрутки до того, как прыжок был сделан? Так что это недетерминированное действие.

Последнее может быть правдой, особенно если страница имеет движущийся заголовок, который прокручивается вне поля зрения, а оставшийся дизайн страницы не означает ничего на том, что он находится на одной странице (если у него также нет вертикального элемента общей высоты как левая панель меню). Вы будете удивлены, сколько страниц имеет эту проблему. просто проверьте их самостоятельно. Перейдите на какую-нибудь страницу, посмотрите на нее сверху, затем нажмите клавишу End и посмотрите на нее снова. Вероятно, вы подумаете, что это другая страница.

Анимированный scrollintoview плагин jQuery для спасения

Вот почему все еще есть плагины, которые выполняют прокрутку в виде вместо использования встроенной функции DOM. Они обычно оживляют прокрутку, которая устраняет все 3 проблемы, описанные выше. Пользователи могут легко отслеживать движение.

Ответ 2

Похоже, он делает: http://www.quirksmode.org/dom/w3c_cssom.html

Ответ 3

Я использую Matteo Spinnelli iScroll-4, и он также работает в сафари iOS. Он имеет три метода scrollTo, scrollToElement и scrollToPage. Скажем, у вас есть неупорядоченный список элементов, обернутых внутри div. Как написал Роберт Коритник выше, вам нужно иметь такую ​​небольшую анимацию, чтобы показать, что вы прокрутили. Метод ниже достигает этого эффекта.

scrollToElement(element, time); 

Ответ 4

Не пробовал это, но похоже, что включение функции встроенного scrollIntoView позволит сэкономить много кода. Вот что я сделал бы, если вы хотите анимированное действие:

• Текущая позиция прокрутки кэша контейнера как ПОЛОЖЕНИЕ СНВ
• запустить встроенный scrollIntoView
• Повторите кэширование позиции прокрутки в качестве КОНЕЧНОГО ПОЛОЖЕНИЯ
• Возврат контейнера обратно в ПОЛОЖЕНИЕ СНВ
• Анимация прокрутки до END POSITION

Ответ 5

прочитайте, пожалуйста, о scrollIntoViewIfNeeded

if(el.scrollIntoViewIfNeeded){
el.scrollIntoViewIfNeeded()
}else{
el.scrollIntoView()
}