Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 26.11.2021, 11:29
Профессор
Отправить личное сообщение для CryNet Посмотреть профиль Найти все сообщения от CryNet
 
Регистрация: 02.01.2019
Сообщений: 151

Как сделать прокрутку к элементу на чистом JS?
Есть список Li елементов. При клике на сам элемент мне нужно прискроллить его к верху странички. Как это сделать?

Песочница: https://codepen.io/CryNet/pen/eYEqGRO

То есть если я кликнул на Paragraph 6, допустим, он у меня должен оказаться в самом верху. Анкоры не вариант, т.к. мне нужно сделать плавную прокрутку. Element.scrollIntoView() тоже -- нет поддержки плавности в Сафари на iOS + не работают scroll-snap-margin-top
Ответить с цитированием
  #2 (permalink)  
Старый 26.11.2021, 11:41
Аватар для ksa
ksa ksa вне форума
CacheVar
Отправить личное сообщение для ksa Посмотреть профиль Найти все сообщения от ksa
 
Регистрация: 19.08.2010
Сообщений: 14,118

Сообщение от CryNet
При клике на сам элемент мне нужно прискроллить его к верху странички. Как это сделать?
Как вариант...
const el = document.getElementById('el');
el.scrollIntoView(); // Прокрутка до верхней границы
el.scrollIntoView(false); // Прокрутка до нижней границы

https://xakplant.ru/2019/03/11/ка...ного-эл/
Ответить с цитированием
  #3 (permalink)  
Старый 26.11.2021, 11:43
Профессор
Отправить личное сообщение для CryNet Посмотреть профиль Найти все сообщения от CryNet
 
Регистрация: 02.01.2019
Сообщений: 151

Сообщение от ksa Посмотреть сообщение
Как вариант...
Та не. Вот почему: scrollIntoView() тоже -- нет поддержки плавности в Сафари на iOS + не работают scroll-snap-margin-top
Ответить с цитированием
  #4 (permalink)  
Старый 26.11.2021, 12:47
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,064

CryNet,
https://javascript.ru/forum/misc/693...tml#post455421
есть ещё десяток, подобного на форуме, надо искать ...
Ответить с цитированием
  #5 (permalink)  
Старый 26.11.2021, 13:05
Профессор
Отправить личное сообщение для CryNet Посмотреть профиль Найти все сообщения от CryNet
 
Регистрация: 02.01.2019
Сообщений: 151

Сообщение от рони Посмотреть сообщение
CryNet,
https://javascript.ru/forum/misc/693...tml#post455421
есть ещё десяток, подобного на форуме, надо искать ...
А-а-а я понял в чём моя проблема и почему у меня не получалось сделать самому прокрутку.

У меня юзается библиотека для кастомных скроллов, и она оборачивает весь контент в div с position absolute + куча других свойств. У меня window.pageYOffset = 0 всегда.

Но, спасибо за решение.
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Как сделать чтобы при наведении мыши на 1-ин елемент 2-ой становился темнне JS nathan111777 Общие вопросы Javascript 8 15.05.2019 15:41
как сделать проверку полей на js boris2000 Элементы интерфейса 12 18.11.2014 12:15
Как сделать плавную прокрутку текста? Чтобы небыло попиксельных скачков ant.kritsky Общие вопросы Javascript 11 01.04.2013 04:49
Как сделать как в JQ? faforty Общие вопросы Javascript 8 14.11.2011 01:35
Как сделать автоматическую прокрутку? Hyuga_Nia Общие вопросы Javascript 24 09.10.2011 21:34