|
Чуть ниже приведены 3 регулятора для изменения цвета. Каждый из них является подключаемым js-файлом, связанным со своим элементом. Попробуйте задать иные оттенки:
|
Фон документа:
|
Фон рабочей зоны:
|
Цвет шрифта:
|
Комментарии:
Данные скрипты желательно подключать к макету страницы сайта, еще не содержащему обозначений классов элементов. Также для каждого настраиваемого элемента (кроме корневого!) необходимо прописать свой ID и цвет по умолчанию.
1) Если вы хотите менять фон всего документа
Это простейший пример. Требуется лишь явно задать какой-то начальный цвет фона для тега BODY и подключить скрипт с номером 1. Ему не нужно передавать ID, он работает с объектом document.
2) Если вы хотите менять фон отдельного элемента
А тут уже несколько сложнее: вы должны в выбранном элементе прописать ID и начальный цвет, кроме того, перед вызовом второго скрипта нужно присвоить в переменную DOC2 (цифра всегда берется по номеру скрипта) элемент с нужным ID.
Здесь вы можете одновременно подключать до четырех регуляторов к разным объектам:
http://www.alex-world.ru/web/demo/selectcolor2.js
http://www.alex-world.ru/web/demo/selectcolor3.js
http://www.alex-world.ru/web/demo/selectcolor4.js
http://www.alex-world.ru/web/demo/selectcolor5.js
3) Если вы хотите менять цвет шрифта всего документа
И снова все просто: скрипт с номером 6 работает с основным цветом шрифта документа, ID передавать не надо. Но стоит иметь ввиду, что если каким-то текстовым элементам уже присвоены стили, на них данный регулятор не подействует. Цвет по умолчанию также необходимо задать!
4) Если вы хотите менять цвет шрифта отдельного фрагмента текста
Если необходимо настроить цвет какого-то текстового блока, то ему также необходимо задать ID и начальный цвет, а перед вызовом скрипта - присвоить данный объект в соответствующую переменную DOC.
Здесь вы можете одновременно подключать до трех регуляторов к разным объектам:
http://www.alex-world.ru/web/demo/selectcolor7.js
http://www.alex-world.ru/web/demo/selectcolor8.js
http://www.alex-world.ru/web/demo/selectcolor9.js
Адрес данной страницы:
http://alex-world.ru/go?selectcolor (в закладки)
| 