Урок №13: встраивание мультимедийных объектов в HTML-код

Мультимедийные объекты встраиваются в HTML-код с помощью парного тега <object> и его параметров. Изначально браузер не понимает мультимедийные объекты и как правило требует запуска вспомогательных программ или подключения специальных модулей (если они не встроены в него изначально), такие модули называют плагинами. В контейнер <object> может быть помещен тег <param>, который задает дополнительные параметры отображения мультимедийного объекта. Также необходимо знать, для старых браузеров, где не работает тег <object>, задается альтернативный тег <embed>. Тег <object> имеет следующие параметры:

• align - выравнивает объект на странице и способ его обтекания текстом ( работает как в случае с изображениями)
• archive - задает путь к файлам, которые необходимы для правильной работы объекта.
• classid - url программы, которая будет работать с данным объектом, и запускать его.
• code - указывает имя объекта для его выполнения
• codebase - задает путь к папке с объектом, который указан атрибутом code или classid.
• codetype - задает тип объекта, который задан атрибутом classid.
• data - адрес файла, для его отображения в браузере
• height - высота объекта, width - ширина объекта
• hspace - вертикальный интервал от объекта до окружающего его контента
• vspace - горизонтальный интервал от объекта до окружающего его контента
• pluginspage - указывает на URL приложения, которое необходимо для просмотра встраиваемого объекта.
• type - mime тип объекта

Данные параметра также применимы и к тегу <embed>. Далее рассмотрим параметры и значения тега <param>:

• name - имя параметра
• value - значение параметра
• type - mime тип параметра
• valuetype - тип значения параметра

Параметры name и value задаются в соответствии с такими значениями тега:

• <param name="movie" value="..."> - задает файл-источник объекта (это необязательно видео, файл может быть с любым мультимедийным расширением)
• <param name="quality" value="..."> - задает качество отображения объекта ( его значения: high-максимальное, medium-среднее, low-низкое)
• <param name="bgcolor" value="..."> - устанавливает фон области отображения объекта.

На прошлых уроках мы научились вставлять аудио и видео файлы, все вышеперечисленные теги и их атрибуты также могут быть использованы для этого. На этом уроке попробуем вставить флеш-анимацию в HTML-код.

Правее находится флеш-изображение с таким HTML-кодом:

<object align="right" classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000"

 codebase="http://active.macromedia.com/flash6/cabs/swflash.cab#version=6.0.0.0"

 width="480" height="360">

<param name="movie" value="http://dina2001.ucoz.ru/flash/344476.swf">

<param name="play" value="true">

<param name="loop" value="true">

<param name="WMode" value="Opaque">

<param name="quality" value="high">

<param name="bgcolor" value="">

<param name="align" value="">

<embed src="http://dina2001.ucoz.ru/flash/344476.swf"

 play="true" loop="true" wmode="Opaque" quality="high"

 bgcolor="" 

pluginspage="http://www.macromedia.com/shockwave/download/index.cgi?P1_Prod_Version=ShockwaveFlash" align="" width="480" height="360">

</object>

На всякий случай, флеш-изображение задано двумя способами, для старых(тег <embed>) и новых(тег<object>)браузеров. Некоторые параметры заданы, однако их значение не указано, соответственно - они не задействованы. Совсем необязательно самому уметь создавать анимированные флешки, некоторые сайты с удовольствием с вами поделятся. Вот очень хороший сайт, который предоставляет HTML шаблоны анимации: Dezzi.ru.

Конечно лучше не злоупотреблять использованием анимации, но это зависит исключительно от тематики сайта и от вашего личного желания. Можно ограничиться анимированными часами, вроде тех что справа.

Чтобы все работало, необходимо сделать две вещи. Во-первых указать mime тип встраиваемого объекта, во-вторых иметь необходимый плагин. Mime тип зависит от расширения файла, более подробно можно посмотреть в таблице ниже.

Далее рассмотрим как задавать ссылки определенным областям изображения - Карта ссылок