Сайт: http://lenininc.narod.ru/
Изменение цвета и внешнего вида полос прокрутки (scroll bar) окна браузера последнее время стало очень популярной <фишкой> Web-дизайнеров. Однако, вопрос о том, как это можно сделать по прежнему часто встречается в различных чатах и конференциях. Эта небольшая статья призвана внести полную ясность в этот, по сути, несложный, но актуальный вопрос...
Иногда, попадая на какой-то сайт, цвет полос прокрутки браузера меняется. Правда происходит это только в том случае, если ваш браузер Internet Explorer версии не ниже 5.5. Создают такой эффект при помощи таблиц каскадных стилей (CSS, Cascading Style Sheets).
На сегодняшний день существуют восемь атрибутов, которыми можно задавать различные параметры полос прокрутки
scrollbar-3d-light-color - цвет контуров трехмерности;
scrollbar-arrow-color - цвет стрелочек;
scrollbar-base-color - базовый цвет (общий фон);
scrollbar-dark-shadow-color - цвет внешней тени;
scrollbar-face-color - цвет ползунков;
scrollbar-highlight-color - цвет контуров подсветки;
scrollbar-shadow-color - цвет внутренней тени;
scrollbar-track-color - цвет полос.
Чтобы изменить цвет прокрутки, поместите данные параметры в тэг , а в качестве значений присвойте шестнадцатеричный RGB код цвета или его название на английском языке, например -
<body style="scrollbar-3d-light-color: blue;
scrollbar-arrow-color: blue;
scrollbar-base-color: red;
scrollbar-dark-shadow-color: white;
scrollbar-face-color: lightgreen;
scrollbar-highlight-color: red;
scrollbar-shadow-color: red;
scrollbar-track-color: green;">
Не обязательно использовать одновременно все атрибуты, иногда достаточно только одного scrollbar-base-color. Если немного "проиграться" с этими параметрами, то можно добиться очень интересных эффектов с прокруткой.
От себя добавлю, что пцвет полос прокрутки можно менять не только у окна браузера, то так же и у других элементов, ее имеющих, например у многострочного текстового поля. Это делается так же как и в случае с окном.
Возможно будет не лишним написать, что необязательно вставлять эти атрибуты конкретно в тег. Размещайте их где захотите:
<style>
body {
scrollbar-3d-light-color: blue;
scrollbar-arrow-color: blue;
scrollbar-base-color: red;
scrollbar-dark-shadow-color: white;
scrollbar-face-color: lightgreen;
scrollbar-highlight-color: red;
scrollbar-shadow-color: red;
scrollbar-track-color: green;
}</style>
<link href="path/filename.css" rel="stylesheet" type="text/css">
Вот и закончился наш очередной выпуск. До новых стреч.
Ведущий рассылки, Алексей Голубев.
При публикации информации из рассылки Вам следует указывать действующую ссылку на нее.
