В листинге 4.19 показано встраивание Flash-объекта. Параметр movie задает имя файла, который надо воспроизвести. Параметр loop отвечает за количество воспроизведений, а play – за автоматическое начало воспроизведения.
Листинг 4.19. Встраивание Flash-графики
<html>
<head>
<title>Встраивание объекта</title>
</head>
<body>
<object classid="CLSID:d27cdb6e-ae6d-11cf-96b8-444553540000" width="300" height="300" type="application/x-shockwave-flash" >
<param name="movie" value="test.swf" />
<param name="play" value="false" />
<param name="loop" value="1">
</object>
</body>
</html>
При обработке этого кода браузер воспроизведет файл test.swf только после соответствующего указания пользователя и проиграет его один раз.
Теперь, когда вы знаете, как встроить Flash или любой другой активный объект на сайт, рассмотрим подробнее проигрыватели и их параметры.
Проигрыватели
Самыми распространенными являются Проигрыватель Windows Media, RealPlayer, QuickTime Player. Каждый из них имеет свой формат файлов, но воспроизводить может практически любые файлы мультимедиа.
Рассмотрим подробнее эти проигрыватели и их самые полезные параметры.
• Проигрыватель Windows Media – стандартный проигрыватель для Windows, его плюс в универсальности: там, где есть Windows, есть этот проигрыватель.
Идентификатор: 22D6F312-B0F6-11D0-94AB-0080C74C7E95.
Параметры приведены в табл. 4.1. Если в таблице в графе Значение указано 0/1, то 0 – выключить функцию, 1 – включить.
Таблица 4.1. Параметры WMP
• RealPlayer – этот проигрыватель, помимо простого проигрывания файлов, приспособлен для воспроизведения радио или телевидения в режиме online.
Идентификатор: CFCDAA03-8BE4-11cf-B8 4B-0 02 0AFBBCCFA.
Параметры приведены в табл. 4.2.
Таблица 4.2. Параметры RealPlayer
Таблица 4.3. Значения параметра controls
• QuickTime Player – воспроизводит большинство современных мультимедийных форматов, включая собственные форматы MOV и QT. Если позволяет скорость подключения, с помощью этого проигрывателя можно просматривать потоковое видео из Интернета.
Идентификатор: 02BF2 5D5-8C17-4B2 3-BC80-D3488ABDDC6B. Параметры приведены в табл. 4.4.
Таблица 4.4. Параметры QuickTime Player
Мы рассмотрели основные виды проигрывателей и их самые востребованные параметры, теперь видео– и аудиосодержимое сайта полностью в вашей власти.
Однако возможности элемента OBJECT не ограничиваются добавлением только музыки и фильмов, есть много других способов для использования этого элемента.
Дополнительные возможности элемента OBJECT
Посмотрим, что еще можно добавить на сайт с помощью элемента OBJECT.
В качестве объекта на сайт можно добавить картинку:
<object height="100" width="100"
type="image/jpeg" data="test.jpeg">
</object>
Можно добавить другой сайт:
<object type="text/html" height="100" width="100"
data="http://www.test.test">
</object>
По сути подобные возможности элемента позволяют добавлять абсолютно любые объекты и управлять ими как угодно.
Приведу интересный пример: добавление календаря, соответствующий код приведен в листинге 4.20.
Листинг 4.20. Добавление календаря
<html>
<head>
<title>Встраивание объекта</title>
</head>
<body>
<object width="500" height="500" classid="clsid:8E27C92B-1264-101C-8A2F– 040224009C02">
</object>
</body>
</html>
Получившийся календарь изображен на рис. 4.15.
Рис. 4.15. Встроенный календарь
Из этих примеров можно понять, что возможности элемента OBJECT очень большие и только от создателя сайта зависит, как они будут использованы.
Резюме
В этой главе мы рассмотрели возможности улучшения вида сайта с помощью картинок, Flash, аудио и видео. Из примеров видно, что возможности языка HTML в этом плане весьма велики.
Однако необходимо проявлять осторожность, чтобы большое количество графики не помешало функциональности сайта, потому что мультимедиа-приложения используют значительные ресурсы для загрузки на компьютер пользователя.
В главе приведены примеры, показывающие универсальность элемента OBJECT и демонстрирующие его дополнительные возможности.
Теперь вы легко можете добавить на сайт картинку, причем разными методами; вставить видео– или аудиофайл вместе с проигрывателем. Вы знаете, в каком направлении двигаться для получения большей функциональности своей страницы.
Глава 5
Фреймы
5.1. Создание фреймов
5.2. Границы фрейма
5.3. Полосы прокрутки
5.4. Ссылки внутри фреймов
5.5. Изменение размеров фреймов
5.6. Плавающие фреймы
5.7. Управление пространством внутри фрейма
5.8. Достоинства и недостатки фреймов
Фреймы (frames) – это HTML-элементы, позволяющие разделить страницу на несколько независимых окон. В каждое окно можно поместить собственную независимую HTML-страницу, в которой может находиться ссылка из одного окна в другое. Фреймы поддерживаются в браузерах версий 3.0 и более. Они применяются в основном для организации постоянно находящихся на экране меню, в то время как в другом окне располагается непосредственно сама информация.
Фреймы чаще всего используют для создания следующих элементов.
• Оглавление – обычно создают в виде вертикального столбца. Пользователи могут обращаться к нему в любой момент, и им не нужно возвращаться к предыдущей странице, чтобы выбрать другой пункт оглавления.
• Неподвижные элементы интерфейса – использование фреймов позволит вам «закрепить» на экране графику, логотипы и другие неподвижные по замыслу элементы, в то время как остальная часть страницы будет прокручиваться во фрейме.
• Формы и результаты – можно в одном фрейме создать форму, а в другом отобразить результаты запроса.
5.1. Создание фреймов
Чтобы HTML-страница содержала фреймы, а экран был разделен на области, необходимо заменить пару тегов <BODY>..</BODY> в коде HTML-страницы парой тегов <FRAMESET>…</FRAMESET>. Необходимо также указать хотя бы один из атрибутов cols или rows. С помощью этих атрибутов задают размеры фреймов и количество строк и столбцов в разбиении страницы. Атрибут cols определяет количество строк, а атрибут rows – количество столбцов. Области, полученные в результате разбиения, и будут являться фреймами. Отсутствие этих атрибутов определяет один фрейм величиной во все окно браузера. В значении атрибутов необходимо указывать не количество строк или столбцов, а значение ширины каждого фрейма через запятую, если рассматривать атрибут cols (например, cols = «13,31,34»). Атрибут rows определяет высоту каждого фрейма соответственно. Размеры фреймов могут задаваться как в абсолютных, так и в относительных величинах.
• Простое числовое значение определяет фиксированную высоту или ширину фрейма в пикселах (например, cols = "20, 100, 20" rows = "30, 100"). Это далеко не самый лучший способ описания размеров фрейма, поскольку различные браузеры имеют различный размер рабочего поля, не говоря уже о различных экранных разрешениях у пользователя. Если вы все же используете данный способ описания размера, то настоятельно рекомендуется сочетать его с каким-либо другим, чтобы в результате вы точно получили стопроцентное заполнение окна браузера пользователя.
• Значение величины фрейма, заданное в процентах от 1 до 100 (например, cols = "20 %, 50 %, 3 0 %" rows = "30 %, 70 %"). Если общая сумма процентов, описывающих фрейм, превышает 100, то размеры всех фреймов пропорционально уменьшаются до суммы 100 %. Если, соответственно, сумма меньше 100, то размеры пропорционально увеличиваются.
• В значении указывается число со звездочкой (например, 5*). Однако числовое значение в данном описании является необязательным. Символ * указывает на то, что все оставшееся место будет принадлежать данному фрейму. Если указывается два или более фрейма с описанием * (например, cols = "*, *, *"), то оставшееся пространство делится поровну между этими фреймами. Если перед звездочкой стоит цифра, то она указывает пропорцию для данного фрейма (во сколько раз он будет больше аналогично описанного просто звездочкой). Например, описание rows = "2*,*,*" говорит, что будет создано три фрейма с размерами 2/3 свободного пространства для первого фрейма и по 1/3 для двух других.
Чтобы в каждой из областей отображалась информация, необходимо использовать элемент FRAME, обязательный атрибут src которого укажет адрес документа, отображаемого внутри фрейма. Если адрес отсутствует, то будет отображен пустой фрейм. Рассмотрим создание фреймов на примере, описанном в листинге 5.1.
Листинг 5.1. Пример создания фреймов
<html>
<head>
<title>Эта страница содержит 4 фрейма</title>
</head>
<frameset cols="45%,*"rows="30%,*">
<frame src=frame1.HTML>
<frame src=frame2.HTML>
<frame src=frame3.HTML>
<frame src=frame4.HTML>
</frameset>
</html>
