Информационная:
Пожалуйста, расскажите о нас друзьям и сделайте репост:
Финансовая:
Если этот сайт вам помог, будем благодарны за любую финансовую помощь:
R598551293139
Урок №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-кодом:
На всякий случай, флеш-изображение задано двумя способами, для старых(тег <embed>) и новых(тег<object>)браузеров. Некоторые параметры заданы, однако их значение не указано, соответственно - они не задействованы. Совсем необязательно самому уметь создавать анимированные флешки, некоторые сайты с удовольствием с вами поделятся. Вот очень хороший сайт, который предоставляет HTML шаблоны анимации: Dezzi.ru.
Конечно лучше не злоупотреблять использованием анимации, но это зависит исключительно от тематики сайта и от вашего личного желания. Можно ограничиться анимированными часами, вроде тех что справа.
Чтобы все работало, необходимо сделать две вещи. Во-первых указать mime тип встраиваемого объекта, во-вторых иметь необходимый плагин. Mime тип зависит от расширения файла, более подробно можно посмотреть в таблице ниже.
MIME-тип
Расширение
application/pdf
pdf
application/postscript
ai eps ps
application/rtf
rtf
application/x-excel
xls
application/x-gzip
gz
application/x-httpd-cgi
cgi
application/x-shockwave-flash
swf
application/zip
zip
audio/mpeg
mp2 mp3 mpga
audio/x-aiff
aif aifc aiff
audio/x-wav
wav
image/gif
gif
image/jpeg
jpe jpeg jpg
image/png
png
image/tiff
tif tiff
text/html
htm html
text/plain
txt
video/mpeg
mpe mpeg mpg
video/quicktime
mov qt
video/x-msvideo
avi
x-world/x-vrml
vrml wrl
В данной таблице расположены самые популярные расширения и их mime типы, для работы с более редкими файлами придется обратится к поисковым системам. Рекомендуем добавить данную страничку в закладки, очень поможет при вставке произвольных объектов.
Далее рассмотрим как задавать ссылки определенным областям изображения - Карта ссылок