Существует ли JS библиотека для создания скроллера-гаттера, как в IDE?

Question

[Тимофей Речкалов]

Во многих IDE рядом с полосой прокрутки стоит гаттер (gutter). На гаттере подсвечиваются точки в файле для быстрого перемещения. В простейшем случае ошибки и предупреждения.
Пример:


Я хочу поставить на своем сайте джаваскриптовый скроллер, который заменит стандартный и который объединит в себе скроллер и гаттер.
От скроллера - скроллинг.
От гаттера - отметки-якоря для быстрого перемещения по странице.

Наиболее близкое из найденного это https://bespoyasov.ru/scroller/, но он только горизонтальный и он не содержит функционал гаттера.

Среди джаваскриптовых библиотек нужного ничего не нашел.
Искал тут: www.javascripting.com/search?q=scroll

Подскажите пожалуйста, известна ли вам библиотека со скроллером, которая это умеет?

Answer 1

[profesor08]

Это очень специфическая штука, особенно для сайтов. И скроллер тебе в любом случае придется генерировать самостоятельно. Тебе известна высота окна прокрутки, тебе известна высота всего контента, тебе известны позиции нужных якорей. Интерполируй эти позиции на высоту панели, размести, привяжи события клика, наведения и тд.

Comments

[Тимофей Речкалов]

У меня уже было такое наколенное решение с отдельным гаттером и скроллером. В рамках этого вопроса я его реализовал, посмотрел что получилось и в дальнейшем планирую от него отказаться.
Как было сказано в ответе "Это очень специфическая штука, особенно для сайтов". В IDE это осмысленно, а с позиции обычного пользователя не очень потому что:
- черточки маленькие на гаттере, надо целиться
- чтобы понять на что черточка указывает нужно навести мышку, почитать всплываху, а это долго. За то же время можно просто до нужного места промотать.
Это не отменяет потребности в быстрой навигации по странице, которую к тому же может быть проще сделать без якорей.
Дальнейшие эксперименты с локальной навигацией будут с нормальными кнопками с надписями.

Answer 2

[Александр Беспоясов]

Возможно, это подойдёт: bespoyasov.ru/bookmark
Он похож на инфоскроллер, где рядом со скроллбаром ссылками отмечаются места, указанные на странице.

Анимация настраивается через data-атрибуты, либо в конфиге.

Comments

[Тимофей Речкалов]

Очень неплохой вариант, но тут важный момент - действительно ли пользователю будет нужно видеть соотношение объемов текста?
В IDE это осмысленно.
В моей же задаче я решил, что нет и что плотное размещение ссылок в быстрой локальной навигации будет уместнее.