@AndrewRusinas

Двунаправленный infinite scroll?

Привет! Необходимо реализовать список, который подгружается при прокрутке в любую сторону. Пример проблемы я отобразил на codepen (пример использует vue, но это не имеет значения). При скролле вниз всё замечательно: intersection observer отрабатывает, список дополняется и можем крутить дальше.

В случае скролла вверх, позиция скролла остается закрепленной вверху, intersection observer срабатывает один раз. Если прокрутить немного вниз и снова вверх, то он сработает еще раз и еще (можно видеть значение переменной try), но все равно мы будем оставаться вверху списка.

Необходимо, чтобы при добавлении элементов в начало списка, скролл сбрасывался на последний элемент этого списка.
Тут есть две проблемы:
-Я не могу задать scrollTop, так как не знаю точную высоту элементов. Возможно, это можно без проблем посчитать и подогнать, ноо..
-В моем конкретном случае, блок скроллится не колесом мыши, а перетаскиванием мыши (вот как здесь). В следствие этого, я не могу назначать scrollTop - он просто игнорируется.

P.S.
Это перефразированная версия ранее созданного вопроса, на которую я не получил ответов.
  • Вопрос задан
  • 138 просмотров
Пригласить эксперта
Ответы на вопрос 2
-Я не могу задать scrollTop, так как не знаю точную высоту элементов. Возможно, это можно без проблем посчитать и подогнать, ноо..

А если через offsetTop первого элемента? То есть запоминаем самый верхний элемент перед вставкой новых, вставляем, скроллим вниз до нового значения offsetTop для запомненного элемента.
Ответ написан
Комментировать
@AndrewRusinas Автор вопроса
Я уже решил тем, что скроллю на на фиксированное количество пик елей, зная размер элементов и их количество, выглядит плавно. Ваш способ тоже должен работать, если ширина заранее неизвестна
Ответ написан
Комментировать
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы