WMASTER.RU - Всё для web-мастера

Евгений Жданов
Российский мультипортал ProtoPlex

Таскаясь по разным сайтам нашего виртуального мира иногда находишь всякие там приятные наворотики для дизайна своих страниц. То цветовая схема понравится, то навигационная система, то целиком сайт. До недавнего времени я пользовался обычным пятым IE, который идёт со стандартным Windows 2000. Потом я поставил версию 5.5 и обнаружил, что на некоторых сайтах мой браузер меняет стиль оформления своего скролл-бара. Скролл-бар - это такая палочка справа экрана (или снизу), которая позволяет нам просмотреть ту часть страницы или элемента окна, которая не уместилась в своей области. Скролл-бар можно двигать двумя способами: либо цеплять его мышкой и тащить до нужной позиции, либо покрутить колёсико на мыши, если ваш крысиный девайс имеет такую достопримечательность на своей серой спинке. Так вот скролл-бар можно оформить на свой вкус. Можно сделать красный скролл-бар, стрелки сделать чёрными, можно вообще всё чёрным оформить. Делается это при помощи обычной таблицы стилей, поэтому даже полный ламер может вставить такую фишку на свой продвинутый сайт.

Расскажу, что я прописал для своего сайта (http://protoplex.com), и вы без труда примените это на своих. Всё очень просто. Нужно добавить немного кода в тег <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 - определяет цвет дорожки прокрутки. Это та фиговинка, по которой собственно и ездит палочка прокрутки. Эдакая пластинка смазаная вазелином :-)

Вообще скролл-бар можно настроить так, что дядя Билли не узнает. Все элементы прокрутчика имеют свои свойства и параметры, которые можно лихо изменить при помощи таблицы стилей. Вы можете поэкспериментировать с ними. Потом напишите, что у Вас вышло :-)