Зачем нам нужна высота окна просмотра для вычисления Процент прокрутки?

Question

Как бы это ни звучало, но мне трудно понять концепцию расчета процента прокрутки.

return Math.ceil(((scrollPosition() + viewportHeight())/pageHeight()) * 100); 

Так что я получил формулу из интернет-ресурса, но я не понимаю, почему нам нужен параметр viewportHeight в приведенной выше формуле?

У меня, конечно, отсутствует что-то очень основное.

Answer 1

scrollPosition() получает, насколько далеко вы прокручиваете страницу вниз, однако измерение берется из верхней части страницы. Вам нужно добавить viewportHieght(), чтобы измерить снизу.

Позвольте мне дать вам пример (надеюсь, это будет лучше объяснить, что происходит):

• страница является 1000px высокого
• Окно просмотра является 200px высокой
• Пользователь прокрутила 500px (scrollPosition() == 500px)

scrollPosition() принимает измерения в верхней части страницы. Это 50% вниз по странице (500/1000 == 1/2 == 50%). Тем не менее, пользователь может видеть дальше, чем верхняя часть окна просмотра. Они могут видеть весь путь до нижней части окна просмотра. Таким образом, даже если они прокрутили вниз 500px, они могут видеть 700px, 70% страницы.

Так как вы можете видеть, без добавления viewportHeight() вы в конечном итоге с другим (меньшим, некорректным) результатом (50% вместо правильных 70%)