ВЕБ-ШКОЛА: Фильтры и превращения. Свойства и методы.

РЕКЛАМА

Разное

Фильтры и превращения.
Свойства и методы.

LIGHT (часть 1)

Фильтр light создает впечатление освещения объекта источником света.

Свойства. нет

Методы.

addAmbient – добавляет источник рассеянного света к "сцене" фильтра.
addCone – добавляет источник конического света (cone light) к "сцене" фильтра, который обрасывает направленный цвет на сцену (направленный источник).
addPoint – добавляет источник света, который позиционирован (заданы координаты) и излучает во все направления (точечный источник).
changeColor – меняет цвет любого источника в сцене
changeStrength – изменяет яркость света.
clear – удаляет все источники света для сцены фильтра.
moveLight – передвигает источник света для сцены фильтра.

Описание. Этот фильтр наиболее сложный из всех визуальных эффектов, т.к. его настройка требует использования методов и написания сценария (т.к. нет свойств). Кроме того требуется иметь представление о источниках света и геометрии.

Без настройки действует фильтр с источником по умолчанию. Источник по умолчанию, представляющий собой рассеянный источник света (ambient light), заменяется при первом же создании (и добавлении к сцене) любого источника света. Как видно, из описания методов можно создавать источники трех типов, контролировать их положение, позицию светового фокуса, цвет, яркость. Максимально возможное количество источников света для одного фильтра – 10. При необходимости большего включения источников цвета необходимо добавлять большее количество фильтров.

Можно применять фильтр для одного объекта (например, для картинки). Для применения светового эффекта к другому объекту (например, к тексту), надо применять другой фильтр. Однако при "оборачивании" нескольких объектов в "оболочку" (например, в тэг <DIV>), можно применить один эффект ко всем объектам, содержащимся в контейнере.

Для применения методов можно поступить насколькими способами. Наиболее распространенный – переопределение функции-обработчика window.onload или onload тэга <BODY>, вызываемого при загрузке документа, например:

<body onload="init()">
  <script language="javascript">
    function init(){
      //инициализация фильтра: добавление источников цвета и пр.
      ...
      some_object.filters.light.addCone(0,0,10,30,50, 255, 145, 56, 60, 80);
      ...
    }
  </script>
...
<div id=some_object style="...; filter:light(); ...">
  <!--объект, к которому применяется фильтр -->
   ...
</div>
....
</body>

Можно не ждать загрузки всего документа и применять фильтр на лету, например:

<body onload="init()">
...
<div id=some_object style="...; filter:light(); ...">
  <!--объект, к которому применяется фильтр -->
  ...
</div>
<script language="javascript">
  some_object.filters.light.addCone(0,0,10,30,50, 255, 145, 56, 60, 80);
</script>
....
</body>

При этом необходимо не забывать, что для объекта желательно, чтобы был определен индентификатор id, иначе прийдется "добираться" до объекта через различного рода коллекции. Следует также помнить, что тело документа загружается быстрее графических файлов картинок, поэтому при инициализации необходимо проверять состояния загрузки графического файла, иначе фильтр не будет иметь эффекта. [> далее >]