Web Leading Group

Добавление Flash

Уроки Web-мастерства — Добавление Flash на Web-страницу

 

Внедрение ролика Flash

Ролики Flash при экспорте авторскими инструментальными средствами Flash оформляются с помощью комбинации элементов object и embed, которые имеют параметры и атрибуты, управляющие выводом на экран и воспроизведением. Применяется сразу два этих элемента, чтобы можно было, несмотря на несовместимость различных браузеров, все же передать плееру как можно больше значений атрибутов для правильной его настройки. Internet Explorer в Windows использует элемент object, который позволяет автоматически загружать элементы управления ActiveX для проигрывания роликов Flash. Netscape на PC и в Mac, Internet Explorer и Safari в Mac не поддерживают ActiveX, поэтому они используют данные, предоставляемые элементом embed. Следует помнить, что элемент embed не является стандартным и дублирует большинство данных (если не все), которые содержаться
в элементе object.

Применение элементов object и embed

Для того чтобы ваша страница была доступна максимальному количеству пользователей, необходимо использовать сочетание элементов object и embed. Ниже нами будут описаны атрибуты обоих элементов. Следует отметить, что элемент embed дублирует большинство параметров родительского элемента object. Приходится включать оба тега, чтобы правильно
работали браузеры, которые не воспринимают должным образом элемент object. Сам элемент embed не является стандартным, но его применение для объектов Flash стало нормой, поэтому мы даём описание и его атрибутов. Код в шаблонах Flash теперь совместим с XHTML. Следует отметить, что быстро изменяются технологии, связанные с HTML, и компания Macromedia периодически пересматривает инструкции в своих разметках. Обновленные версии можно найти на страницах поддержки: Adobe — Flash Support Center.

Элемент object

Элемент object указывает браузеру Internet Explorer (3.0 и более старших версий) на необходимость загрузки и установки конкретного элемента ActiveX для проигрывания файлов Flash, позволяя при этом задавать многие атрибуты ролика Flash.

Ниже мы приводим пример элемента object с основными параметрами:

<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="500" height="300" align="middle">
<param name="allowScriptAccess" value="sameDomain" />
<param name="movie" value="file.swf" />
<param name="quality" value="high" />
<param name="bgcolor" value="#ffffff" />
</object>

Параметр classid определяет идентификатор элемента управления ActiveX для Flash, a codebase показывает место, откуда он будет загружаться браузером. Значение атрибута classid должно быть в вашем файле HTML именно таким, каким оно указано выше (этот идентификатор применим для всех версий Flash). Следует отметить, что атрибут codebase ссылается на версию 9 плеера. Плееры других версий и подверсий можно задавать подобным способом, подстраивая номер версии. Атрибуты width и height обязательны. Следует отметить, что размеры можно задавать также в процентах (соответственно степени заполнения роликом окна браузера). По умолчанию авторскими инструментальными средствами экспортируются также стандартные значения атрибутов id и align. Несколько параметров (param) могут быть добавлены как дочерние узлы элемента object.

  • param name=»allowScriptAccess» value=»always | never | sameDomain» — этот атрибут позволяет управлять в ролике Flash доступом к скриптам JavaScript или VBScript на странице HTML, содержащей этот ролик Flash. Flash может вызывать JavaScript или VBScript с помощью функций fscommand() или getURL(). Значение sameDomain позволяет ролику Flash получить доступ к любому скрипту на странице HTML и файлам .swf, расположенным в одном и том же домене. Значение always позволяет ролику Flash получать доступ к любому скрипту страницы независимо от домена, а значение never вообще запрещает ролику Flash получать доступ к любому скрипту.
  • param name=»movie» value=»file.swf» — параметр movie, возможно, является самым важным атрибутом, и с его помощью вы указываете плееру Flash, какой файл необходимо проигрывать. Если его не указать, вы получите на экране всего лишь окрашенный прямоугольник.
  • param name=»quality» value=»low | autolow | autohigh | high | medium | best» — этот атрибут управляет качеством сглаживания контурных неровностей.При значении autolow анимация начинается с низким уровнем качества (несглаженные контуры) и переключается на высокий уровень качества (сглаженные контуры), если компьютер пользователя работает достаточно быстро.При значении autohigh, напротив, анимация начинается в режиме высокого качества воспроизведения и переходит на нормальный уровень качества, если компьютер работает слишком медленно.При значении high сглаживание применяется независимо от быстродействия компьютера. Значение medium (введено начиная с версии Flash 5) приводит к тому, что сглаживание будет превышать уровень low, но не high.Значение best обеспечивает уровень сглаживания high и сглаживает также контурные неровности всех растровых изображений. При этом значении процессор работает наиболее интенсивно.
  • param name=»bgcolor» value=»#RRGGBB» — этот параметр используется для переопределения цвета фона кадра ролика Flash, например для того, чтобы он соответствовал фону Web-страницы. Значение задает цвет RGB в шестнадцатеричном виде.
  • param name=»play» value=»true | false» — если play имеет значение true, проигрывание ролика начнется автоматически. При значении false проигрывание ролика должен инициировать пользователь. По умолчанию используется значение true.
  • param name=»loop» value=»true | false» — определяет, будет ли проигрывание ролика зацикливаться. По умолчанию используется значение true.
  • param name=»menu» value=»true | false» — нажатие правой кнопки в Windows или кнопки Control в Маc, когда курсор находится на ролике Flash, выводит на экран меню с функциями управления проигрыванием. Установка параметра menu в значение false приводит к тому, что в этом меню остается лишь строка «About Flash Player» (о плеере Flash) и удаляются функции изменения масштаба изображения, управления качеством, проигрывания, перемотки, зацикливания, продвижения вперед, назад и функция печати.
  • param name=»scale» value=»showall | noborder | exactfit» — этот атрибут совместно с процентными значениями параметров width и height определяет, в какой мере анимация заполняет фрейм плеера.При значении showall (используется по умолчанию) ролик размещается во фрейме с сохранением пропорций изображения (может быть видимым фон фрейма, а также один или два края ролика).Значение noborder приводит к полному заполнению фрейма при сохранении пропорций ролика (изображение может быть обрезано по одному или по двум краям). При значении exactfit изображение полностью заполняет весь фрейм, но оно может искажаться, если размеры фрейма плеера и ролика не соответствуют друг другу.
  • param name=»salign» value=»l | t | r | b» — этот атрибут задает положение ролика внутри фрейма плеера и используется вместе с атрибутом scale. Буквы l, r, t и b соответствуют словам left, right, top и bottom, определяя выравнивание влево, вправо, вверх и вниз. Можно использовать любые сочетания l или r с t или b, например lt приводит к расположению ролика в верхнем левом углу окна браузера. Если задано значение showall атрибута scale, справа и ниже ролика появятся незанятые поля.
  • param name=»wmode» value=»window | opaque | transparent»— этот атрибут позволяет устанавливать прозрачным фоновый слой ролика Flash. По умолчанию используется значение window, при котором фон будет иметь цвет панели Stage или примет значение параметра bgcolor. Значение opaque позволяет слоям DHTML перекрывать ролик Flash, а значение transparent скрывает фоновый цвет, чтобы можно было видеть другое содержимое документа HTML сквозь вашу анимацию. Следует отметить, что этот атрибут со всеми плеерами Flash работает только в IE 3 и в его следующих версиях, а с версиями плеера Flash 6.045 или выше он работает в большинстве других браузерах.
  • param name=»devicefont» value=»true | false» — этот атрибут показывает, будут ли использоваться шрифты устройства для всего текста, содержащегося в ролике Flash. Отметим, что на эти шрифты не действуют некоторые режимы, установленные авторскими инструментальными средствами Flash, и этот атрибут применим только на машинах с Windows. По умолчанию используется значение false.
  • param name=»flashvars» value=»name=value» — этот атрибут позволяет передавать переменные в ролик Flash. Подобно тому, как передается строка URL, вы можете здесь
    передавать пары «имя-значение», которые становятся доступными в начале временной шкалы ролика Flash. В теге embed можно использовать такие же дополнительные атрибуты, какие были описаны для тега object (quality, loop, play и т. д.). И снова следует напомнить, что тег embed не является стандартным, однако его все же рекомендуется использовать, чтобы как можно больше браузеров могли в максимальной мере обеспечить заданную в скрипте функциональность. Если требуется исключить тег embed, чтобы ролик Flash полностью отвечал стандартам, рекомендую прочитать статью: Flash Satay: Embedding Flash While Supporting Standards, в которой описываются преимущества и трудности, возникающие во время проигрывания ролика Flash при удалении тега embed.

Элемент embed

Тег embed с основными атрибутами имеет следующий вид:

<embed src="file.swf" quality="high" bgcolor="#ffffff" width="500" height="300" name="file"

align="middle" allowScriptAccess="sameDomain" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer" />

  • Атрибут src (подобно параметру movie тега object) указывает плееру Flash, где находится загружаемый файл.
  • Атрибуты width и height здесь тоже задают размеры изображения или ролика в пикселах.
  • Атрибут pluginspage содержит URL страницы, с которой пользователь может загрузить плеер Flash, если он не будет найден на компьютере пользователя (применяйте именно тот URL, который указан в примере). Этот атрибут рекомендуется задавать, но он не является обязательным. Существует несколько атрибутов (некоторые из них специфичны для Flash), которые применимы в теге embed только совместно. Ниже описываются все атрибуты этого тега. Следует отметить, что многие из них дублируют параметры тега object. Если какой-нибудь атрибут приводится без комментария, это значит, что его смысл совпадает со смыслом описанного ранее такого же атрибута тега object:
  • src=»file.swf» quality=»low | autolow | autohigh | high | medium | best» id=»текст» или name=»текст» — с помощью атрибута name ролику назначается имя, что необходимо делать, если он вызывается из JavaScript или внутри формы. На практике обычно используется имя файла .swf без расширения.
  • bgcolor=»#RRGGBB»
  • width=»(количество пикселов)»
  • height=»(количество пикселов)»
  • align=»left | right | top | bottom | middle» — атрибут align позволяет выравнивать положение плеера Flash в окне браузера. По умолчанию используется значение middle, но считается, что для этой цели лучше использовать тег TD.
  • allowScriptAccess=»always | never | sameDomain»
  • type=»application/x-Shockwave-flash»
  • pluginspage=»http://www.macromedia.com/go/getflashplayer»
  • loop=»true | false»
  • play=»true | false»
  • menu=»true | false»
  • align=»left | right | top | bottom»
  • scale=»showall | noborder | exactfit»
  • salign=»l | r | t | b»
  • base=»url» — атрибут base задает базовый URL и каталог, относительно которого указываются пути к файлам внутри ролика Flash.
  • swLiveConnect=»true | false» — этот тег включает функцию LiveConnect браузера Netscape, которая позволяет плагинам и Java-апплетам связываться с JavaScript. Установите значение true, если в вашем ролике имеются FS-команды, в противном случае лучше задать значение false (используется по умолчанию), чтобы не было задержек при выводе изображений на экран.
  • scale=»showall | noborder | exactfit»
  • wmode=»window | opaque | transparent»
  • devicefont=»true | false»

Пример кода, применимого для всех браузеров

Чтобы ваш ролик Flash был доступен максимальному числу пользователей, рекомендуется использовать оба элемента object и embed. Важно, чтобы элемент embed находился внутри элемента object, и тогда пользователи Internet Explorer не получат две копии вашего ролика. Для размещения файла Flash 9, у которого сглаживаются контуры, на странице с шириной 500 пикселов и высотой 300 пикселов, проигрывание которой начинается автоматически и затем зацикливается, можно использовать следующий код.

Пример кода:


<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="500" height="300" align="middle">
<param name="allowScriptAccess" value="sameDomain" />
<param name="movie" value="file.swf" />
<param name="quality" value="autohigh" />
<param name="play" value="true" />
<param name="loop" value="true" />
<param name="bgcolor" value="#ffffff" />
<embed src="file.swf" quality="autohigh" bgcolor="#ffffff" width="500" height="300"
name="file" align="middle" play="true" loop="true" allowScriptAccess="sameDomain"
type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer" />
</object>

 

Небольшие хитрости размещения роликов с сервиса youtube.com на вашем сайте

Возможность прямой вставки видео с youtube кодом html?

Для чего это может быть нужно?

http://www.youtube.com/youtubeonyoursite?hl=ru

1. Как смотреть видео на ютуб в высоком качестве

На ютуб, есть огромное количество видео роликов да еще в таком качестве, что не грех плеер на весь экран растянуть, для того что бы проверить, есть ли видео в лучшем качестве к строке адреса добавьте ‘&fmt=18? (стерео, 480 х 270 разрешение) или ‘&fmt=22? (стерео, 1280 x 720 разрешение).

2. Как вставить ролик с ютуб на сайт с хорошим качеством

Так мы разобрались как смотреть ролики в хорошем качестве, но такое чудо и посетителям своим показать не грех, для этого добавляем к embeded коду или “&ap=%2526fmt%3D18? или “&ap=%2526fmt%3D22? соответственно.

3. Как вставить ссылку на ролик ютуб, на определенную минуту (секунду)

Порой в роликах самый интересный момент начинается после 5 минут бреда, а тратит время на всякую чепуху ой как не хочется. По этому, для того что бы сохранить время ваших друзей добавляйте к ссылке “#t=03m22s” m – минуты, s – секунды.

4. Как спрятать окно поиска в ютуб

Чeртово окно поиска неудобное да и в принципе не нужное – зачем оно нам, не так ли, давайте и его уберем – ‘&showsearch=0?

5. Как вставить только кусок видео с ютуб

Порой это просто необходимо, по этому мы просто подставляем к ссылке ‘&start=30? и видео начинается с 30 секунды.

6. Как автоматически проигрывать видео в embeded с ютуб

Помучайте юзеров, заставьте их смотреть видео постоянно при каждой загрузке и перезагрузке – с помощью ‘&autoplay=1?

7. Автоматическое повторение видео ролика с ютуб

И тут все просто, поможет приписка к адресу ролика ‘&loop=1?

8. Убрать похожие ролики

Опять все просто ‘&rel=0?

9. Отключить ограничение по региону

Бывает и такое, для того что бы отключить этот запрет – меняем адрес ролика с
http://www.youtube.com/watch?v = <какой-то код> на http://www.youtube.com/v/ <какой-то код>

10. Как скачать видео с ютуб?

Да просто меняем youtube.com на ssyoutube.com и скачивайте на здоровье

Контакты

an image
Компания
Web Leading Group

E-mail: 552243@mail.ru
Тел.: +79991059599