|
Как изменить цвета скролл-бара у Internet Explorer
5.5 и выше |
Таскаясь по разным
сайтам нашего виртуального мира иногда находишь всякие там приятные
наворотики для дизайна своих страниц. То цветовая схема понравится, то
навигационная система, то целиком сайт. До недавнего времени я пользовался
обычным пятым IE, который идёт со стандартным Windows 2000. Потом я
поставил версию 5.5 и обнаружил, что на некоторых сайтах мой браузер
меняет стиль оформления своего скролл-бара. Скролл-бар - это такая палочка
справа экрана (или снизу), которая позволяет нам просмотреть ту часть
страницы или элемента окна, которая не уместилась в своей области.
Скролл-бар можно двигать двумя способами: либо цеплять его мышкой и тащить
до нужной позиции, либо покрутить колёсико на мыши, если ваш крысиный
девайс имеет такую достопримечательность на своей серой спинке. Так вот
скролл-бар можно оформить на свой вкус. Можно сделать красный скролл-бар,
стрелки сделать чёрными, можно вообще всё чёрным оформить. Делается это
при помощи обычной таблицы стилей, поэтому даже полный ламер может
вставить такую фишку на свой продвинутый сайт.
Расскажу, что я
прописал для своего сайта (http://protoplex.ru), и вы без труда примените
это на
своих. Всё очень просто. Нужно добавить немного кода в тег
<STYLE>, который задаёт стили на всей странице. Его вставляют в
начало страницы, чтобы он сидел внутри тега <HEAD> Тег на моём
мультипортале имеет следующий вид:
<style type="text/css">
BODY {SCROLLBAR-FACE-COLOR: #0000dd; SCROLLBAR-HIGHLIGHT-COLOR: white;
SCROLLBAR- SHADOW-COLOR: black; SCROLLBAR-ARROW-COLOR: #ffffff;
SCROLLBAR-TRACK-COLOR: #ffffff;} </style>
Такой фрагмент
вы можете стащить у меня целиком, а можете приложить к нему свою руку и
модифицировать его под цветовую схему своего сайта. Так будет
намного красивее и полезнее. Сейчас расскажу, что к чему относится:
SCROLLBAR-FACE-COLOR - задаёт основной цвет скролл-бара, которым
закрашивается сама палочка прокрутки, и две завершающие кнопочки со
стрелками. Также, если вы не задали параметр SCROLLBAR-TRACK-COLOR, у вас
изменится цвет задней части крутилки.
SCROLLBAR-HIGHLIGHT-COLOR -
устанавливает цвет подсветки, создающий эффект объёмности. Тот цвет,
который окаймляет освещённую часть кнопочки. Когда кнопка не нажата цвет
заливает левый верхний угол и стороны между ним, когда нажата - нижний
правый угол.
SCROLLBAR-SHADOW-COLOR - цвет тени, также служит для
придания объекту объёмности. Тень - она и в Африке тень. Куда без неё.
SCROLLBAR-ARROW-COLOR - устанавливает цвет стрелок на крайних
позициях крутилки.
SCROLLBAR-TRACK-COLOR - определяет цвет дорожки
прокрутки. Это та фиговинка, по которой собственно и ездит палочка
прокрутки. Эдакая пластинка смазаная вазелином :-)
Вообще
скролл-бар можно настроить так, что дядя Билли не узнает. Все элементы
прокрутчика имеют свои свойства и параметры, которые можно лихо изменить
при помощи таблицы стилей. Вы можете поэкспериментировать с ними. Потом
напишите, что у Вас вышло :-)
Евгений В.
Жданов
http://protoplex.ru/
Немного от себя: наверное, Вы заметили изменённый цвет скролл-бара на
этой странице. Так вот, тут использован такой стиль:
style="scrollbar-face-color: #A9A9A9; scrollbar-highlight-color: #f3f3f3;
scrollbar-shadow-color: black; scrollbar-arrow-color: blue;
scrollbar-track-color: #f0f0f0;"
|