пользовательская полоса прокрутки без jquery

Question

Я ищу пользовательскую полосу прокрутки, которая работает без jquery. Я не могу использовать jquery, потому что другой материал также jqueryless и оптимизирован для быстрой загрузки.

Был бы благодарен за любые идеи, которые были предоставлены мне.

NONNNNN

Answer 1

Если вы не хотите использовать JQuery вы всегда можете попытаться CSS (работает только в WebKit).

JSFIDDLE

Пример CSS:

::-webkit-scrollbar { 
    width: 15px; 
} 

::-webkit-scrollbar-track { 
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3); 
    background-color: #000000; 
} 

::-webkit-scrollbar-thumb { 
    border-radius: 10px; 
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.5); 
    background-color: #555555; 
} 

::-webkit-scrollbar-button { 
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.5); 
    background-color: #000000; 
    background-image: url(dark/light-blue/images/ui-icons_0990fb_256x240.png); 
} 

::-webkit-scrollbar-button:vertical:increment { 
    background-position: -64px -16px; 
} 

::-webkit-scrollbar-button:vertical:decrement { 
    background-position: 0 -16px; 
} 

::-webkit-scrollbar-button:horizontal:increment { 
    background-position: -32px -16px; 
} 

::-webkit-scrollbar-button:horizontal:decrement { 
    background-position: -96px -16px; 
} 

::-webkit-scrollbar-corner { 
    background-color: #000000; 
} 

More on WebKit Custom Scrollbars

Если вы хотите поддержку нескольких браузера вы хотите использовать JQuery или написать свой собственный код Javascript с присоединяя DIV для прокрутки и добавления обработчиков событий, чтобы знать, когда вы прокручиваете.

Example of Custom Scrollbar Code

Answer 2

Ok, для людей, которые ищут также хороший скроллинга без зависимостей:

Вы можете использовать IScroll, если вам нужно немного больше, чем просто скроллинга или Gemini Scrollbar, что совершенно удивительно и использует собственное поведение прокрутки.