изображение для следования полос прокрутки

Question

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

Спасибо за вашу помощь.

Answer 1

Информация о том, как браузер представляет полосу прокрутки, если она вообще есть, с какой стороны окна она включена или как она отображается недоступна на веб-странице.

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

Возьмите document scroll position / document height * display port height, и это даст вам приблизительное количество пикселей, где находится полоса прокрутки в верхней части экрана.

Сделайте ваш HTML-элемент position: fixed; и установите top: 123px в соответствии с приведенным выше расчетом.Обновите это в событии прокрутки.

Вам понадобится Google для конкретных команд JavaScript, чтобы это произошло, но в принципе, это должно вас довольно близко.

---

Если вычтобы быть более точным, имейте в виду, что размер полосы прокрутки обычно составляет (display port height / document height) * display port height.Если вы вычли это значение из диапазона движения стрелки и добавили половину этого значения к значению top в пикселях вашей стрелки, оно обычно должно указывать на середину полосы прокрутки.

Answer 2

Используйте position: fixed css, чтобы элемент располагался относительно окна браузера.