logo
СС ЭВМ лекция

4.1.10. Фреймовые структуры

Большинство современных броузеров могут показывать в одном окне несколько отдельных страниц. Достигается это разбиением страницы на кадры или фреймы. В каждом кадре может выводиться отдельная страница. Управляя кадрами, можно создать удобный и разнообразный интерфейс. Например, можно слева вывести узкий кадр с оглавлением страницы, справа сверху показать фирменную эмблему и кнопки для перемещения по оглавлению, а внизу все материалы страницы.

Для разбиения страницы на кадры создают главный файл, в котором описывается вся кадровая структура страницы. При просмотре страницы, соответствующей главному файлу, на экран выводятся все заданные кадры. Их размещение описано в кадровой структуре. Для задания структуры кадров используется тег <FRAMESET>.

В странице с кадровой структурой нет тега <BODY>. После тега </HEAD>, закрывающего описание "заголовка" этой страницы размещается тег <FRAMESET>. Он содержит информацию о количестве будущих кадров, их размерах и ориентации. У него могут быть только два атрибута: ROWS=, задающий количество и размер кадров, расположенных друг над другом вертикально, и COLS=, задающий число и размер кадров, расположенных друг за другом горизонтально. Рассмотрим в качестве примера тег <FRAMESET COL="20%, 80%">, указывающий на количество кадров, равное двум, и расположение окон в виде вертикальных полос. Их размер может быть указан в пикселях или процентах от размера окна броузера. В данном варианте тега выделяются два кадра: один слева шириной 20% от общего размера окна броузера, другой, правый, занимает оставшиеся 80% окна.

Тег <FRAME> определяет внешний вид кадров и их оформление. Он может иметь следующие атрибуты:

NAME= для задания имени кадра и для использования этой информации в ссылках при открытии ссылок именно в этом кадре;

MARGINWIDTH= для определения размера горизонтального отступа между содержимым кадра и его границами. Наименьшее значение равно 1. По умолчанию отступ равен 6;

MARGINHEIGHT= для определения размера поля в верхней и нижней части кадра;

SCROLLING= для управления прокруткой. Вариант значения этого тега SCROLLING=YES создает полосы прокрутки, даже если они не требуются с учетом размера окна и места, необходимого для вывода информации. Для варианта значения SCROLLING=NO полос прокрутки не будет никогда. Для варианта значения SCROLLING=AUTO вывод полос прокрутки выполняется автоматически, если это нужно для полного отображения информации. Этот вариант ответа задается по умолчанию.

NORESIZE = для устранения возможности изменения размера кадра с использованием мыши.

SRC= для задания страницы, показываемой в этом кадре. Это обязательный атрибут.

Тег <FRAME SRC="имя1"> для рассматриваемого примера задает описание кадра. В данном случае описан первый кадра. Наименование имя1 должно указать имя страницы, которая будет показана в этом кадре. При необходимости помимо имени указывается путь к файлу, содержащему эту страницу. Например, вместо "имя1" можно написать http://www.ltn.lv/~loft5/left.htmlили просто right.html, если этот файл находится в текущей директории рядом с главным файлом.

Тег <FRAME SRC="имя2" NAME="main"> дает описание второго кадра. В нем, помимо указания на страницу, задается имя кадра, пригодное для использования в дальнейшем. Оно будет использовано для указания, в каком кадре открывать вторую страницу. Тег </FRAMESET> закрывает тег <FRAMESET>, с которого начиналось описание структуры окна. Далее можно разместить теги <NOFRAMES> и закрывающий его тег </NOFRAMES>. Между этими тегами находится информация, которую увидит пользователь компьютера, броузер которого не поддерживает отображение фреймов или кадров. Обычно текст содержит пояснение и предложение обновить броузер. Например, текст может быть таким: "Вы смотрите на страницу, имеющую фреймовую структуру, с помощью броузера, не поддерживающего кадры. Рекомендуем установить обновленную версию броузера для просмотра этого и других подобных сайтов. Вы можете загрузить новые версии броузера по адресам:

http://www.microsoft.com/ie/- Internet Explorer 3.0 или выше;

http://www.netscape.com- Netscape Navigator. "

Тег </HTML> согласно общим правилам закрывает главный файл.

Файлы, соответствующие выбранным страницам, представляют собой обыкновенные Web-страницы. Единственная особенность этих страниц в том, что им отводится меньше места, чем обычно. Простой пример показывает разбиение страницы на два фрейма.

Пример 6.

<HTML>

<HEAD>

<TITLE>

Создание фреймов

</TITLE>

</HEAD>

<FRAMESET COLS=”40%,*”>

<FRAME SRC=”left.htm” BORDER=10 BORDERCOLOR=”#202020”

NORESIZE SCROLLING=YES NAME=”LEFT” MARGINHEIGHT=20 MARGINWIDTH=30>

<FRAME SRC=”right.htm” NAME=”RIGHT”>

</FRAMESET>

<NOFRAME>

<BODY>

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

</BODY>

</NOFRAME>

</HTML>

Для более сложного размещения фреймов теги <FRAMESET> могут быть вложенными.

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

В ссылки страницы с оглавлением добавляется атрибут TARGET="имя" для того, чтобы они открывались не в текущем кадре, а в основном кадре с выбранным именем. Возможны несколько вариантов указания имени фрейма.

TARGET=name. Этот атрибут используется в ссылке для открытия ссылки в кадре с именем name. Этот атрибут следует выбирать очень внимательно, т.к. если в ссылке будет задано несуществующее имя кадра, могут произойти непредсказуемые изменения, в частности, появление новых окон просмотра.

Кроме обыкновенных кадров существуют так называемые "волшебные кадры". Их имена начинаются с символа "_". Никакие другие кадры не могут начинаться с этого символа. К ним относится кадр "_blank". Если атрибут TARGET= ссылается на кадр с таким именем, то ссылка откроется в новом пустом окне. Кадр "_self". Ссылка, открытая в кадре с таким именем, откроется в текущем кадре, даже если до этого был указан атрибут BASE= (например, <BASE TARGET="main">), предписывающий открывать этот документ по умолчанию в кадре main. Кадр "_parent". Ссылка открывается в родительской кадровой структуре. Это очень непредсказуемый вариант открытия кадра. Лучше избегать его. Кадр "_top". Ссылка, открывающаяся в этом кадре, будет показывать соответствующую страницу в новом окне.

Существуют так называемые плавающие окна. Они выглядят как окно на странице, в котором показывается содержимое другой страницы. Создаются с помощью тега <IFRAMENAME="content_frame"width="x"height="y"SRC="имя.htm"> Комментарий, который будет выводиться вместо окна в броузере, не поддерживащем плавающие окна </IFRAME>. Здесь x - ширина окна в пикселях, y - высота в пикселях, имя - имя страницы, отображаемой в окне. Этот тег применяется только в InternetExplorer3.0 и выше.

В рассмотренном выше примере TARGET="main" (имя main в примере задано в описании второго кадра).