Выпуск №10. Работа со звуком в HTML

Дата публикации: 2009-07-15

звуковые файлы

Всем привет. C Вами Андрей.

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

Существует 3 метода встраивания звуковых файлов.

Первый вам уже знаком. Это ссылка на звуковой файл — универсальный вариант, который поддерживается большинством браузеров.

<a href="myfile.mp3"> текст ссылки </a>

По нажатию на эту ссылку, автоматически запускается стандартная программа для воспроизведения файлов указанного формата, обычно это Windows Media (воспроизводит AIFF, AU, MIDI, WAV и МРЗ — файлы). Этот вариант вам знаком, поэтому пойдем дальше.

Практический курс по верстке адаптивного лендинга с нуля!

Научитесь с нуля верстать адаптивные лендинги на HTML5 и CSS3 за ближайшие 6 дней

Узнать подробнее

Второй способ заключается в использовании контейнера <embed>.

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

Еще для того что б этот контейнер отображался, в браузере должен быть установлен специальный плагин. В Internet Explorer он стоит по умолчанию, а вот что касается остальных браузеров, то не у всех он может быть. Тогда его придется установить.

<embed src="intro.mp3" width="500" height="300"></embed>

1	<embed src="intro.mp3" width="500" height="300"></embed>

Параметр src – обязательный, определяет имя проигрываемого файла. Остальные параметры можно не указывать. Их перечень приведен ниже.

WIDTH=n — определяет ширину консоли в пикселях.

HEIGHT=m — определяет высоту консоли в пикселях.

AUTOSTART=TRUE|FALSE — если имеет значение TRUE, воспроизведение начинается автоматически.

AUTOLOAD=TRUE|FALSE — если имеет значение FALSE, файл не загружается автоматически.

STARTTIME="mm:ss" — воспроизведение начинается с указанного в минутах секундах момента от начала файла.

REPEAT= TRUE / FALSE — разрешает или запрещает повторять звуковой/видео клип.

PLAY LOOP=Z — если Вы указали REPEAT-TRUE, укажите здесь вместо Z количество повторений.

VOLUME=percentage — громкость воспроизведения, указанная в процентах от максимальной.

ALIGN="value" — выравнивает консоль управления по отношению к тексту страницы. Может иметь значения CENTER, BASELINE TOP LEFT, RIGHT.

CONTROLS="value" — задает набор органов управления консоли. Может иметь следующие значения (они объяснены далее)-CONSOLE, SMALLCONSOLE, PLAYBUTTON PAUSEBUTTON, STOPBUTTON И VOLUMELEVER.

Практический курс по верстке адаптивного лендинга с нуля!

Научитесь с нуля верстать адаптивные лендинги на HTML5 и CSS3 за ближайшие 6 дней

Узнать подробнее

CONSOLE — полный набор органов управления.

SMALLCONSOLE — компактное представление консоли. Полный набор органов управления, кроме кнопки паузы.

PLAYBUTTON — только кнопка воспроизведения.

PAUSEBUTTON — только кнопка паузы.

STOPBUTTON — только кнопка остановки. При этом файл выгружается.

VOLUMELEVER — только регулятор громкости.

С параметрами разобрались.

Предлагаю вам самим попробовать применить различные параметры и посмотреть, как они работают (тут ничего сложного нет).

Третий способ – это указать звуковой файл фоновым звуком для страницы.

Синтаксис тут простой:

<bgsound

src=filename — чзвуковой файл

lоор=n — количество повторов (infinite — непрерывно)

volume — громкость (от 10000 до 0,0 — значение по умолчанию)

balance — баланс между левой и правой колонками, значение может изменяться от -10000 (максимум для левого канала) до 10000 (максимум для правого канала).

Пример:

<bgsound src="intro.mp3" balance="0" loop="infinite" volume="5" />

1	<bgsound src="intro.mp3" balance="0" loop="infinite" volume="5" />

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

На этом, выпуск посвященный звуку в HTML и подключению его к сайту, закончен.