Как сделать изогнутый скроллбар на javascript?

Question

[Undrooleek]

Друзья, как сделать изогнутый скроллбар на javascript?
Может есть плагины или наработки (или мысли), как его можно сделать?

Вот как должен выглядеть:


Спасибо

Comments

[Юрий Лобанов]

Вертикальный? Как это должно выглядеть?

[Brain Storm]

покажи пример (нарисуй)

Answer 1

[itspers]

Ну разве что спрятать обычный, кссом нарисовать такую фигню, в виде куска гигансткого круга с бордер радиусом. Чтоб кссом менять ему прогресс. Потом повесится на событие скролла и менять этот прогресс пропорционально scrollTop. А потом еще драг какой-нить повесить, чтоб курсором скролить.
Вряд ли кто-то такого готовое где-то найдется, кому бы оно пришло в голову делать. Но в общем виде реализуемо.

Answer 2

[Юрий Лобанов]

Делаем картинку самого бара с прозрачной кривой линией скролла. Помещаем его в div с fixed. Под нее помещаем div нужного цвета, задаему ему z-индекс ниже, чем у дива с баром. После этого регулируем позицию дива под скроллбаром в зависимости от положения на странице.
Должно сработать, как Вы думаете? )

Comments

[Undrooleek]

а как бы с драггом бегунка скролла?

[Undrooleek]

*скроллбара

[Юрий Лобанов]

@Undrooleek как вариант, при наведении на скроллбар пусть появляется небольшой бегунок. Его можно двигать или строго по вертикали, или смещая и по горизонтали с помощью нехитрых вычислений. Правда он будет убегать из-под мышки.
Тут еще проблема как картинку растянуть, например. И с мобильными браузерами опять же (поддержка тач-устройств предполагается? )

[Undrooleek]

Идея строго под Chrome и строго под 1-2 размера немобильных экрана.

[Юрий Лобанов]

@Undrooleek в таком случае вполне реализуемо! Сделайте над скролбаром еще один див, прозрачный, пусть он дублирует положение синего дива, который под скроллбаром. И на него вешайте драг.

[Undrooleek]

спасибо!я попробую!

Answer 3

[Undrooleek]

На картинке выше показана дуга. Это и есть вид предполагаемого скроллбара. Бледно-синеее вверху это бегунок