@answerson

Прокрутка видимой области экрана через заданное количество секунд — как сделать?

Здравствуйте, господа!
Есть HTML документ, который по сути является длинным текстом.
Необходимо сделать прокрутку видимой части через заданное количество секунд. То есть, по сути необходима функция читалки.
Есть скрипты для авоматического скроллинга, но тут задача как раз в том, чтобы, видимая часть экрана поднималась вверх полностью через X секунд, и так до конца страницы.
Подозреваю, что можно реализовать через CSS или через что-либо другое.
Был бы благодарен, если бы чуток разжевали, ибо сами неместные.
  • Вопрос задан
  • 83 просмотра
Пригласить эксперта
Ответы на вопрос 2
hzzzzl
@hzzzzl
function scroll() {
  const SECONDS_INTERVAL = 2   // как часто листать

  window.scrollTo({
    top: window.pageYOffset + window.innerHeight,
    behavior: 'smooth'
  });

  if(window.pageYOffset + window.innerHeight + 30 <= document.body.clientHeight) {
    setTimeout(scroll, SECONDS_INTERVAL * 1000)
  }
}


scroll()
Ответ написан
delphinpro
@delphinpro Куратор тега CSS
frontend developer
Задача на "Скорость-время-расстояние" =)
Знакомо из школьной программы?

Скорость = screen.height / 1000; /* один экран за одну секунду */
Расстояние = body.scrollHeight; /* высота всей страницы */
Время = ?

Время = Расстояние / Скорость;

$('body').animate({scrollTop: Расстояние * -1}, Время);


или через пропорцию

screen.height - 1000
body.scrollHeight - t?

t = body.scrollHeight * 1000 / screen.height;


PS.
Высота страницы чуть сложнее определяется.
ScrollTop нужно точнее вычислять (высота страницы минус один экран).
Точный синтаксис animate я не помню.
Ответ написан
Ваш ответ на вопрос

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

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