русс | укр

Языки программирования

ПаскальСиАссемблерJavaMatlabPhpHtmlJavaScriptCSSC#DelphiТурбо Пролог

Компьютерные сетиСистемное программное обеспечениеИнформационные технологииПрограммирование

Все о программировании


Linux Unix Алгоритмические языки Аналоговые и гибридные вычислительные устройства Архитектура микроконтроллеров Введение в разработку распределенных информационных систем Введение в численные методы Дискретная математика Информационное обслуживание пользователей Информация и моделирование в управлении производством Компьютерная графика Математическое и компьютерное моделирование Моделирование Нейрокомпьютеры Проектирование программ диагностики компьютерных систем и сетей Проектирование системных программ Системы счисления Теория статистики Теория оптимизации Уроки AutoCAD 3D Уроки базы данных Access Уроки Orcad Цифровые автоматы Шпаргалки по компьютеру Шпаргалки по программированию Экспертные системы Элементы теории информации

РАСКРЫТИЕ ВСЕХ ПУНКТОВ ОГЛАВЛЕНИЯ


Дата добавления: 2015-09-15; просмотров: 826; Нарушение авторских прав


Создадим документ, разбивающий окно просмотра с помощью фреймов на две прямоугольные области: левую и правую. В левую область поместим оглавление в виде списка, в правую область - документ, загруженный в соответствии с выбранным пунктом оглавления. Предусмотрим возможность работы в режиме, когда пользователь может "раскрыть" или "свернуть" одновременно все пункты оглавления.

При решении задачи поступим следующим образом: создадим два оглавления, одно содержит только пункты верхнего уровня, т.е. "свернутое" оглавление, а во втором оглавлении все пункты раскрыты. В обоих документах предусмотрены ссылки, при нажатии на которые меню "сворачивается" или "раскрывается". Приведем пример основного оглавления:

Пример 4.1 Основное оглавление

<html>
<head>
<title>Анкета слушателя курсов</title>
</head>
<body background="decor.gif" bgcolor=silver>
<BASE TARGET=right>
<H3>Оглавление</H3>
<A HREF="contall.htm" TARGET=left>Раскрыть</A>
<A HREF="content.htm" TARGET=left>Свернуть</A>
<OL>
<LI><A HREF="ch1.htm">Основы языка HTML</A>
<LI><A HREF="ch2.htm" >Графика</A>
<LI><A HREF="ch3.htm">Карта-изображение</A>
<LI><A HREF="ch4.htm">Списки</A>
<LI><A HREF="ch5.htm">Таблицы</A>
<LI><A HREF="ch6.htm">Фреймы</A>
</OL>
</body>
</html>

Ниже приведен пример, когда оглавление раскрыто и в правый фрейм загружен соответствующий выбранному подпункту документ.

Пример 4.2 Документ, соответствующий"раскрытому" оглавлению

<HTML>
<HEAD>
<TITLE>Оглавление развернутое</TITLE>
</HEAD>
<BODY background="decor.gif" bgcolor=silver>
<BASE TARGET=right>
<H3>Оглавление</H3>
<A HREF="contall.htm" TARGET=left>Раскрыть</A>
<A HREF="content.htm" TARGET=left>Свернуть</A>
<OL>
<LI><A HREF="ch1.htm">Основы языка HTML</A>
<UL>
<LI><A HREF="ch1.htm">Теги</A>
<LI><A HREF="ch1.htm">Параметры и значения</A>
<LI><A HREF="ch1.htm">Структура документа</A>
<LI><A HREF="ch1.htm">Форматирование документа</A>
</UL>
<LI><A HREF="ch2.htm">Графика</A>
<UL>
<LI><A HREF="ch2.htm">Фоновые изображения</A>
<LI><A HREF="ch2.htm">Встраиваемые изображения</A>
<LI><A HREF="ch2.htm">Выравнивание</A>
<LI><A HREF="ch2.htm">Размеры</A>
</UL>
<LI><A HREF="ch3.htm">Карта-изображение</A>
<UL>
<LI><A HREF="ch3.htm">Использование</A>
<LI><A HREF="ch3.htm">Представление</A>
<LI><A HREF="ch3.htm">Описание конфигурации</A>
<LI><A HREF="ch3.htm">Варианты реализации</A>
</UL>
<LI><A HREF="ch4.htm">Списки</A>
<UL>
<LI><A HREF="ch4.htm">Маркированные</A>
<LI><A HREF="ch4.htm">Нумерованные</A>
<LI><A HREF="ch4.htm">Списки определений</A>
</UL>
<LI><A HREF="ch5.htm">Таблицы</A>
<UL>
<LI><A HREF="ch5.htm">Простые таблицы</A>
<LI><A HREF="ch5.htm">Данные внутри таблицы</A>
<LI><A HREF="ch5.htm">Вложенные таблицы</A>
</UL>
<LI><A HREF="ch6.htm">Фреймы</A>
<UL>
<LI><A HREF="ch6.htm">Использование</A>
<LI><A HREF="ch6.htm">Описание</A>
<LI><A HREF="ch6.htm">Взаимодействие</A>
</UL>
</OL>
</BODY>
</HTML>



СОЗДАНИЕ И ИСПОЛЬЗОВАНИЕ "ПЛАВАЮЩИХ" ФРЕЙМОВ

Тег <IFRAME>

Браузер 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-код документа, содержащего список задач, и плавающий фрейм, имеет вид:

Пример 6. Использование плавающих фреймов

<html>
<head>
<TITLE>Использование плавающих фреймов</TITLE>
</HEAD>
<BODY background="decor.gif">
<h4 align=center>Для выполнения задания выберите задачу</h4>
<iframe src=indiv.htm name="flframe" height=350 width=70% hspace=10 scrolling=auto align=right>
Ваш браузер не позволяет отображать плавающие термы
</iframe>
<h4>Темы заданий</h4>
<ol>
<li><a href="indiv.htm#1" target="flframe">экспорт товаров</a></li>
<li><a href="indiv.htm#2" target="flframe">курсовые работы</a></li>
<li><a href="indiv.htm#3" target="flframe">график обследования</a></li>
<li><a href="indiv.htm#4" target="flframe">отгрузка со склада</a></li>
<li><a href="indiv.htm#5" target="flframe">технический осмотр</a></li>
<li><a href="indiv.htm#6" target="flframe">пансионат</a></li>
<li><a href="indiv.htm#7" target="flframe">регистрация переговоров</a></li>
<li><a href="indiv.htm#8" target="flframe">расписание экзаменов</a></li>
<li><a href="indiv.htm#9" target="flframe">учет товаров</a></li>
<li><a href="indiv.htm#10" target="flframe">выдача ключей</a></li>
<li><a href="indiv.htm#11" target="flframe">абонементы</a></li>
<li><a href="indiv.htm#12" target="flframe">тестирование</a></li>
</ol>
</BODY>
</HTML>



<== предыдущая лекция | следующая лекция ==>
ЗАГРУЗКА ВО ФРЕЙМ ДОКУМЕНТОВ ИЗ РАЗНЫХ ФАЙЛОВ | Имя фрейма


Карта сайта Карта сайта укр


Уроки php mysql Программирование

Онлайн система счисления Калькулятор онлайн обычный Инженерный калькулятор онлайн Замена русских букв на английские для вебмастеров Замена русских букв на английские

Аппаратное и программное обеспечение Графика и компьютерная сфера Интегрированная геоинформационная система Интернет Компьютер Комплектующие компьютера Лекции Методы и средства измерений неэлектрических величин Обслуживание компьютерных и периферийных устройств Операционные системы Параллельное программирование Проектирование электронных средств Периферийные устройства Полезные ресурсы для программистов Программы для программистов Статьи для программистов Cтруктура и организация данных


 


Не нашли то, что искали? Google вам в помощь!

 
 

© life-prog.ru При использовании материалов прямая ссылка на сайт обязательна.

Генерация страницы за: 0.004 сек.