Создадим документ, разбивающий окно просмотра с помощью фреймов на две прямоугольные области: левую и правую. В левую область поместим оглавление в виде списка, в правую область - документ, загруженный в соответствии с выбранным пунктом оглавления. Предусмотрим возможность работы в режиме, когда пользователь может "раскрыть" или "свернуть" одновременно все пункты оглавления.
При решении задачи поступим следующим образом: создадим два оглавления, одно содержит только пункты верхнего уровня, т.е. "свернутое" оглавление, а во втором оглавлении все пункты раскрыты. В обоих документах предусмотрены ссылки, при нажатии на которые меню "сворачивается" или "раскрывается". Приведем пример основного оглавления:
Браузер Microsoft Internet Explorer разрешает использование так называемых плавающих фреймов, описание которых может быть расположено в тексте обычного HTML-документа.
Для определения плавающего фрейма используется тег <iframe>. В теге <iframe> могут встречаться те же параметры, что и в теге описания обычных фреймов, кроме параметра NORESIZE, так как размер плавающего фрейма не может быть изменен пользователем. Браузеры, не поддерживающие тег <iframe>, отображают информацию, записанную между тегами <iframe> и </iframe>.
В следующем примере HTML-документа используется описание плавающего фрейма. Описание плавающего фрейма напоминает описание встраиваемого в документ изображения. Параметр src определяет адрес загружаемого во фрейм изображения. Параметр name задает имя фрейма для того, чтобы можно было получить доступ к фрейму, например, из сценария.
Пример 5.1 Использование плавающих фреймов
В плавающий<HTML> <HEAD> <TITLE>Использование плавающих фреймов</TITLE> </HEAD> <BODY bgcolor="FFFFCC"> <h4 align=center>Шишкин Иван Иванович</h4> <iframe src=textsh.htm name="flframe"> Отображение плавающих фреймов в Вашем браузере не предусмотрено </iframe> <ol> <li><a href=pictsh.htm target="flframe">картина</a> <li><a href=textsh.htm target="flframe">описание</a> </ol> </BODY> </HTML> фрейм можно загрузить другие документы, используя определенные на странице гиперссылки.
ПАРАМЕТРЫ ДЛЯ ЗАДАНИЯ "ПЛАВАЮЩИХ" ФРЕЙМОВ
Для плавающих фреймов с помощью параметров можно задавать размеры фрейма, горизонтальное выравнивание, размер отступа содержимого фрейма от границ.
В следующем примере приведено описание плавающего фрейма и заданы параметры. Заданный фрейм имеет высоту 320 пиксель, занимает по ширине 60% окна, расположен справа от текста, полосы прокрутки будут установлены в случае, если документ не будет помещаться во фрейм. Содержимое фрейма должно быть отделено от границы по горизонтали и вертикали на заданное число пиксель.
Пример 5.2 Плавающие фреймы и их параметры
<html> <head> <title>Плавающие фреймы и их параметры</title> </head> <body bgcolor="FFFFCC"> <h4 align=center>Творчество русских художников</h4> <iframe src=pictsh.htm name="flframe" height=320 width=60% hspace=50 vspace=10 scrolling=auto align=right> Ваш браузер не позволяет отображать плавающие термы </iframe> <ol> <li><a href=pictsh.htm target="flframe">картина</a></li> <li><a href=textsh.htm target="flframe">описание</a></li> </ol> </body> </html>
НАВИГАЦИЯ ВНУТРИ ДОКУМЕНТА В "ПЛАВАЮЩЕМ" ФРЕЙМЕ
Создадим документ, в котором с левой стороны хранится список задач. При выборе задачи из списка условие задачи появляется в плавающем фрейме, который расположен в окне просмотра справа.
В документе с условиями задач перед условием первой задачи расположим два тега <a name="1"></a>, а далее перед условием задачи с номером i расположим тег <a>, параметр name которого равен i. Таким образом, подготовили текст условий задач для ссылок на задачи с соответствующим номером. Пусть имя файла с условиями задач indiv.htm. HTML-код документа, содержащего список задач, и плавающий фрейм, имеет вид: