Разноцветная полоса прокрутки (скроллер)

  • Не нравится
  • +1
  • Нравится
Разноцветная полоса прокрутки (скроллер)
Иногда в дизайн сайта не вписывается полоса прокрутки (скроллер). Сейчас я покажу как изменить вид скролла.

Установка


В файл стилей вписываем вот этот код:

body {
scrollbar-3dlight-color: blue;
scrollbar-darkshadow-color: blue;
scrollbar-arrow-color: blue;
scrollbar-base-color: blue;
scrollbar-face-color: blue;
scrollbar-highlight-color: blue;
scrollbar-track-color: blue;
scrollbar-shadow-color: blue;
}


При таком коде цвета будут все голубые

И так, давайте разберем код по порядку:

scrollbar-3d-light-color - Цвет верхней и левой границ полосы прокрутки, ее бегунка и стрелок.
scrollbar-darkshadow-color - Цвет правых и нижних граней тени, отбрасываемых бегунком и кнопками прокрутки.
scrollbar-arrow-color - Цвет стрелок на кнопках полосы прокрутки
scrollbar-base-color - Цвет бегунка и кнопок-стрелок полосы прокрутки
scrollbar-face-color - Цвет бегунка и кнопок прокрутки.
scrollbar-highlight-color - Цвет левых и верхних граней освещенной части бегунка и кнопок прокрутки.
scrollbar-track-color - Цвет рабочей части полосы прокрутки, т.е той ее части, по которой перемещается бегунок.
scrollbar-shadow-color - Цвет неосвещенной части бегунка и кнопок прокрутки.

И еще: данные стили работают только в Opera, IE.
Не работают в Mozilla Firefox, Chrome

Вот и все :)

Пример



Удачи)

Коментарии