Вставка Flash-документов. Вставка звука и видео

Flash-документ (мультфильм, ролик, клип) может включать разнородное содержимое: текст, растровую и векторную статическую и анимационную графику, звук, видео и элементы пользовательского интерфейса. Вы можете создать отдельную страницу или даже целый сайт, используя технологию Flash. Flash-документы разрабатываются с помощью пакета Vacromedia Flash, выходные файлы которого имеют расширение swf. Просмотр sef-файлов производится с помощью специального Flash-проигрывателя. Чтобы просматривать swf-файл в окне браузера MS Internet Explorer, требуется элемент управления ActiveX, реализующий функции Flash-проигрывателя, ссылка на который вставляется в HTML-документ с помощью тегов <object> и <param>:

<object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=9,0,0,0"<object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=9,0,0,0"

id = "myflash">

<param name = "movie" value = "URL-адрес swf-файла ">

</object>

Здесь атрибут classid принимает в качестве значения идентификатор объекта, соответствующего Flash-проигрывателю.

Атрибут codebase содержит URL-адрес исходных файлов Flash-проигрывателя версии 9.0 на случай если он не установлен на компьютере пользователя.

Тег <param> служит для указания URL-адреса swf-файла, содержащего Flash-документ, который должен быть воспроизведен Flash-проигрывателем.

Атрибут id указан только для обеспечения возможности доступа к объекту с помощью сценария.

Чтобы Flash-проигрыватель был вставлен в веб-страницу браузерами, не воспринимающими теги <object> и <param> (например, Nestcape Navigator), внутри внутри контейнера <object> используется тег <embed>:

<object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=9,0,0,0"

<param name = "movie" value = "URL-адрес swf-файла ">

<embed src = "URL-адрес swf-файла " name = "myflash"

type = application/x-shockwave-flash"

pluginspage = "http://www.macromedia.com/go/getflashplayer">

</object>

Здесь в теге <embed> атрибут name играет такую же роль, что и id в <object>, а атрибут pluginspage — что и codebase.

Кроме рассмотренных выше, можно использовать много других параметров Flash-проигрывателя, среди которых отметим наиболее важные, задаваемые с помощью тегов <param>:

В пакете Macromedia Flash имеются средства автоматизации создания HTML-документа, содержащего заданный Flash-документ, которые позволяют легко установить все необходимые параметры.

Рассмотрим пример размещения Flash проигрывтеля на веб-странице.

<object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=9,0,0,0" width="550" height="400" id="banner" align="middle">

<param name="movie" value="../../../images/avto1.swf">

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

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

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

</object>

В окне веб-браузера это будет выглядеть ТАК.

Вставка звука и видео

Современные веб-браузеры могут воспроизводить видео и звуковые файлы различных форматов. Для этого они используют встроенные проигрыватели (plug-in, элементы управления ActiveX) или внешние программы проигрыватели. Вставить звук или видео в HTML-документ можно с помощью различныз тегов:

При решении вставить звук и/или видео в HTML-документ следует учитывать, что соответствующие файлы имеют довольно большой объем. Наиболее популярными в веб сейчас являются файлы звуковых форматов MP3, WMA, AIFF, AU, RealAudio (c расширением ra и ram), MP4, MIDI и видеоформатов MPEG, MOV. Звуковой формат WAV и видеоформат AVI в Интернете используются довольно редко.

Для операционной системы Windows стандартными звуковыми файлами являются WMA и WAV, для Macintosh — AIFF. Общепринятым видеоформатом для Windows, Macintosh и UNIX является MPEG. Формат QuickTime (MOV) также широко распространен и может использоваться Windows и Macintosh. При выборе других форматов желательно предупреждать об этом пользователей.

Фоновый звук

Тег <bgsound> позволяет указать звуковой файл формата WMA, AU, MIDI или WAV, который проигрывается при загрузке страницы. При этом на экран не выводится панель управления воспроизведением.

Тег <bgsound> имеет следующие атрибуты:

Пример:

<bgsound src="ib_logfile0" loop="3">

Применение тега img и ссылок

Тег <img> применяется в основном для вставки графических изображений, адрес файла которых указывается атрибутом src. Этот тег имеет еще один атрибут dynsrc, с помощью которого можно узнать адрес видеофайла формата AVI. Если указаны оба атрибута, dynsrc и src, то действует dynsrc.

Атрибуты, определяющие воспроизведение видеофайлов, таковы:

Пример:

<img dynsrc = "myvideo.avi" loop = 2 start = mouseover>

Можно также использовать и другие атрибуты тега <img>, например, align, border, hspase и vspace.

Для воспроизведения звуковых и видео файлов можно использовать тег ссылки <a>, указав в качестве значения атрибута href URL-адрес файла. При этом файл будет воспроизводиться в окне приложения(проигрывателя), которое ассоциировано с данным типом файла и установлено на компьютере пользователя. Это может быть, например,Windows Media Player, панель Медиа (в Internet Explorer), Winamp, QuickTime Player или RealPlayer G2.

URL-адрес файла RealAudio имеет вид:

pnp://адрес_файла.

Технология RealAudio обеспечивает передачу звука и видео практически в режиме реального времени и позволяет устраивать аудио- и видеоконференции. Звуковые файла RealAudio имеют расширение ra. Кроме того, могут использоваться метафайлы с расширением ram. Это обычные текстовые файлы, содержащие полные URL-адреса файлов с расширением ra.

Пример:

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1251">
<title>Вставка звука</title>
</head>

<body>
Сергей Трофимов
<a href="S._Trofimov-Snegiri.mp3">Снегири</a>
</body>
</html>

В окне веб-браузера это будет выглядеть ТАК.

Применение тега embed

Тег <embed> позволяет встроить в веб-страницу документы различных типов для просмотра их соответствующим приложением. При встраивании звука и видео в окне браузера появляется панель того проигрывателя, который ассоциирован с данным типом файлов. Обратите внимание, что панель проигрывателя встраивается в документ, отображаемый в окне веб-браузера, а не появляется в виде автономного окна, как в случае использования ссылок.

Рассмотрим пример, где с помощью тега <embed> встраиваются три звуковых и один видеофайл. Размеры панелей воспроизведения можно задать с помощью атрибутов width и heiht.

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1251">
<title>Звук и видео</title>
</head>

<body>
<p>Сергей Трофимов
<p>Снегири <embed src="S._Trofimov-Snegiri.mp3">
<p>Порутчик <embed src="Trofim-01_poruchik.mp3" width="200" height="150">
<p>Пролог <embed src="Trofim-01_prolog.mp3">
<p>Видео <embed src="../../../images/avto1.swf" width="350" height="250">
</body>
</html>

В окне веб-браузера это будет выглядеть ТАК.

Тег <embed> имеет следующие атрибуты, связанные с воспроизведением звука и видео:

Кроме перечисленных, тег <embed> имеет еще атрибуты code и codebase, имеющие такой же смысл, что и для тега <object>.

Тег object

Тег <object> позволяет вставлять в HTML-документы графические изображения, HTML-документы, элементы ActiveX и апплеты.

Тег <object> является контейнерным и обладает множеством атрибутов:

Кроме перечисленных выше, тег <object> имеет атрибуты class и style (для задания параметров каскадной таблицы стилей), title (для задания текста всплывающей подсказки) и атрибуты-события (для связи с их обработчиками).

Встраиваемый компонент может иметь параметры, которые задаются с помощью тегов <param>, вставляемых в контейнер <object>. Для каждого параметра требуется отдельный тег <param>, имеющий следующие атрибуты:

Кроме элементов ActiveX и апплетов, с помощью тега <object> можно вставлять в веб-страницы графические изображения из файлов формата GIF и JPEG, звуковые файлы, а также HTML-документы. Для этого необходимо использовать атрибуты data и type. Значением атрибута data является URL-адрес вставляемого графического или html-файла. Значением атрибута type является тип данных в этом файле: image/jpeg или image/gif для графического и text/html — для html-файла.

Вставляемые объекты указанных выше типов отображаются в отдельных окнах, подобных плавающим фреймам и снабженных при необходимости полосами прокрутки. Размеры этих окон устанавливаются с помощью атрибутов width и height. В отличие от тега <img>, специальнопредназначенного для вставки графики, эти атрибуты не влияют на размеры графического изображения (не маштабируют его). Они задают размеры только окна отображения графики.

Для корректного отображения в окне веб-браузера графики и HTML-документов, вставляемых посредством тега <object>, последние либо должны находится в контейнере <body>, либо исходный HTML-документ должен содержать, кроме тега <object>, еще какой-нибудь элемент, способный принять фокус (например, текст).




  • Другие |

Похожие материалы по теме: Публикация графики Flash на веб-странице

назадвверхвперед
Rambler's Top100