Фреймовая структура с загружаемыми документами

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

Пусть оглавление документа содержит шесть пунктов и располагается в файле с именем contents.htm. Требуется, чтобы файл, включающий в себя оглавление, загружался в левый фрейм. Файлы с именем chl.htm … ch3.htm содержат документы, соответствующие пунктам оглавления. Взаимодействие между фреймами и документами представлено на рисунке.

<html>

<head>

<title> Простая фреймовая структура </title>

</head>

<frameset cols= “30%, 70%”>

<frame src=contents.htm name=left>

<frame src=empty.htm name=right>

</frameset>

</html>

В правый фрейм первоначально загружается файл с именем empty.htm. В левый фрейм помещается оглавление, которое содержит ссылки на документы, расположенные в различных файлах. HTML- код, содержащий оглавление, хранится в листинге.

<html>

<head>

<title> Оглавление </title>

</head>

<body>

<base target=right>

<h3>Оглавление</h3>

<ol> <li><a href=”chl.htm”>Динамический HTML </a>

<li><a href=”ch2.htm”>Фильтры</a>

<li><a href=”ch3.htm”>Визуальные эффекты </a>

</ol>

</body>

</html>

Во многих случаях при начальной загрузке помещают в файл страницу с титульным листом. При описании фреймовой структуры в таком случае следует для правого фрейма задать адрес файла с титульной страницей. При выборе пункта меню в левом фрейме соответствующий документ появляется в правом фрейме.

Обмен содержимым фреймов

Для ссылки на фреймы можно использовать имена. Сначала следует запомнить имя файла, загруженного в левый фрейм (для этого используется переменная). Затем в левый фрейм загружается документ, расположенный в правом фрейме. Это достигается выполнением оператора присваивания

top.left.location=top.right.location или top.frames[0].location=top.frames[1].location

Свойство location содержит текущий URL-адрес страницы, загруженной в окно.


Понравилась статья? Добавь ее в закладку (CTRL+D) и не забудь поделиться с друзьями:  



double arrow
Сейчас читают про: