Фреймы

Подгрузка меню для сайта с фреймами

Фреймы в HTML позволяют авторам представлять документы в нескольких разделах, которые могут быть независимыми или вложенными окнами. Например, в одном окне может располагаться меню для управления сайтом, а в другом отдельные страницы, перемещаться между которыми можно с помощью меню. Для задания фреймов необходимо как минимум три HTML документа: два первых — документы, загружаемые в разные фреймы, а третий — документ, в котором сказано, что окно браузера необходимо разбить на 2 фрейма и подгрузить в эти фреймы 2 HTML документа. Итак, что должен содержать этот документ? Вот примет простейшего HTML документа:

Как видно из примера, этот документ не должен иметь тега . Сами фреймы задаются тегами , причем в одном HTML документе может быть несколько тегов . В нашем случае в теге указано, что нужно создать два вертикальных фрейма, причем первый должен иметь ширину 200 точек, а второй — все, что осталось (cols=200,*), ширину фреймов можно также задавать в долях и в процентах, например, cols=»20%,80%» означает, что будут созданы 2 вертикальных фрейма с шириной 20 и 80 процентов от ширины экрана, также можно создавать и горизонтальные фреймы, если вместо cols указать rows. Параметр frameBorder задает ширину границы между фреймами, параметр frameSpacing — ширину пустого пространства между ними. С помощью тегов можно задавать имя подгружаемых файлов (параметр srс), параметр scrolling отвечает за появление полос прокрутки, если размеры HTML документа превышают размеры фрейма, в нашем случае полосы прокрутки у первого фрейма отсутствуют.

Теперь, когда мы научились загружать различные HTML документы во фреймы, можно заняться управлением содержимым одного фрейма из другого. Такая задача может встать при необходимости сделать меню управления сайтом. Чтобы при нажатии на ссылку в одном фрейме загружался документ в другой фрейм, необходимо в теге параметр target сделать равным имени фрейма, в который необходимо загрузить HTML документ. В нашем случае если сделать ссылку в фрейме menu: doc, то при нажатии на эту ссылку документ doc.htm будет загружаться в фрейм site.

Многие Web-мастера очень плохо относятся к фреймам. Я же связался с фреймами для того, чтобы меню сайта не загружалось заново при переходе на каждую страницу. Однако у этой медали есть и другая сторона: Вам когда-нибудь встречались HTML документы, на которых полностью отсутствуют ссылки на другие страницы? Если встречались, то я готов поспорить, что эти документы должны были подгружаться во фрейм, а все ссылки должны быть расположены на панели управления сайтом. Но пользователь, который зайдет на эту страницу, не будет разбираться и уйдет с нее, а Ваш сайт будет зарабатывать плохую репутацию. Как пользователь вообще выходит на такие страницы? Здесь все просто — через поисковую систему.

Но и у этой проблемы есть решения.

Конечно, здесь средствами самого языка HTML не обойтись, а придется как минимум использовать JavaScript, а то и PERL (можно PHP или CGI-приложение, написанное на чем угодно).

1. Первое, что нужно сделать — проверить, есть ли фрейм панели управления сайтом. Если есть, то ничего делать не надо.

2. Если фрейма нет, то необходимо изменить код данной страницы или вместо данной загрузить новую.

Проверку на наличие фреймов можно осуществлять в JavaScript:

Эта процедура запускается при начале загрузки HTML документа, иногда пользователь может не понять, в чем дело (настолько быстро осуществляется переход на новый документ). Если параметр «parent.frames.length» имеет значение 0, то родительский фрейм и, следовательно фрейм с меню отсутствуют и должен загружаться другой HTML документ. Если при загрузке документа doc.htm процедура не обнаружит фрейма с меню (если в doc.htm содержится эта процедура), то URL текущего документа изменится на http://www.zahodi-ka.ru/doc_.htm, то есть будет загружаться doc_.htm. В нашем случае в doc_.htm содержится следующий код:

Итак все работает, только есть один недостаток: для каждого HTML документа должен быть такой документ, в котором содержалась бы информация о загрузке первого в отдельный фрейм.

Здесь легко усмотреть закономерность: все эти дополнительные HTML документы должны быть одинаковые и похожие на вышеприведенный код, только различаться параметром ИМЯ_ДОКУМЕНТА. Значит вывод таких документов можно поручить скрипту, а ИМЯ_ДОКУМЕНТА можно сообщать в качестве параметра. Код новой процедуры будет тот же самый, только отличаться новым URL, теперь будет не загружаться новый документ, а подаваться запрос к CGI (PHP и т.д.): document.URL=»http://www.zahodi-ka.ru/zagruzka.pl?a= ИМЯ_ДОКУМЕНТА». В таком случае будет запущен скрипт zagruzka.pl, а в качестве параметра будет передано ИМЯ_ДОКУМЕНТА. Этот скрипт пишите кто на чем умеет (я, например, на PERL). Если ты ни на чем не умеешь, пиши на PERL:

#!/usr/bin/perl $str=$ENV; #записываем в переменную $str ИМЯ_ДОКУМЕНТА $c="""; print "Content-Type: text/htmlnn"; print " n"; print "n"; print "n"; print "n";

Источник

Ссылки во фреймах

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

Предположим, у нас есть документ, состоящий из двух фреймов, названных MENU и CONTENT, как изображено на рис. 1.

Рис. 1. Вид документа с фреймами

Обычно в левом фрейме находится список ссылок на разделы сайта, а в правом фрейме отображается содержимое документов. Чтобы веб-страница открывалась в определенном фреймовом окне, следует использовать следующий код (пример 1).

Пример 1. Открытие документа во фрейме

      
Ссылка открывает сайт www.htmlbook.ru во фрейме с именем CONTENT
  

Если атрибут ссылки target=»CONTENT» будет опущен, документ откроется в текущем фрейме, где находится сама ссылка.

Чтобы одновременно обновить сразу два фрейма и загрузить в них разные документы, придется воспользоваться JavaScript (пример 2, 3).

      
 Нажми на меня, нажми
  

Ссылка используется как обычная, но в качестве атрибута добавляется событие onclick , отслеживающее нажатие на ссылку. Обратите внимание, что имя фрейма следует писать также, как оно указано в атрибуте name (в данном случае заглавными символами). JavaScript чувствителен к регистру и мнительно относится к любому неправильному написанию.

Источник

Ссылки во фреймах

В обычном HTML-документе при переходе по ссылке, в окне браузера текущий документ заменяется новым. При использовании фреймов схема загрузки документов отличается от стандартной. Основное отличие — возможность загружать документ в выбранный фрейм из другого. Для этой цели используется атрибут target тега . В качестве значения используется имя фрейма, в который будет загружаться документ, указанный атрибутом name (пример 13.5).

Пример 13.5. Ссылка на другой фрейм

В приведенном примере фрейму присваивается имя CONTENT . Чтобы документ загружался в указанный фрейм, используется конструкция target=»CONTENT» , как показано в примере 13.6.

Пример 13.6. Содержимое файла menu2.html

      
МЕНЮ
 
Текст
  

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

• _blank — загружает документ в новое окно;
• _self — загружает документ в текущий фрейм;
• _parent — загружает документ во фрейм, занимаемый родителем, если фрейма-родителя нет значение действует также, как _top ;
• _top — отменяет все фреймы и загружает документ в полное окно браузера.

HTML по теме

Не выкладывайте свой код напрямую в комментариях, он отображается некорректно. Воспользуйтесь сервисом cssdeck.com или jsfiddle.net, сохраните код и в комментариях дайте на него ссылку. Так и результат сразу увидят.

Популярные рецепты

• Как добавить картинку на веб-страницу?
• Как добавить иконку сайта в адресную строку браузера?
• Как добавить фоновый рисунок на веб-страницу?
• Как сделать обтекание картинки текстом?
• Как растянуть фон на всю ширину окна?
• Как выровнять фотографию по центру веб-страницы?
• Как разместить элементы списка горизонтально?
• Как убрать подчеркивание у ссылок?
• Как убрать маркеры в маркированном списке?
• Как изменить расстояние между строками текста?
• Как сделать, чтобы картинка менялась при наведении на нее курсора мыши?
• Как открыть ссылку в новом окне?

Популярные задачи

• TEX
• Отступы между блоков
• Андроид в тени
• Ссылка как кнопка
• Вложенные списки
• Форма регистрации
• Объединение ячеек таблицы
• Обязательные поля формы
• Цвет и фон в таблице
• Асуанская плотина
• Батарейка
• Заголовки

Источник

Ссылки во фреймах

В обычном HTML-документе при переходе по ссылке, в окне браузера текущий документ заменяется новым. При использовании фреймов схема загрузки документов отличается от стандартной. Основное отличие — возможность загружать документ в выбранный фрейм из другого. Для этой цели используется атрибут target тега . В качестве значения используется имя фрейма, в который будет загружаться документ, указанный атрибутом name (пример 13.5).

Пример 13.5. Ссылка на другой фрейм

В приведенном примере фрейму присваивается имя CONTENT . Чтобы документ загружался в указанный фрейм, используется конструкция target=»CONTENT» , как показано в примере 13.6.

Пример 13.6. Содержимое файла menu2.html

      
МЕНЮ
 
Текст
  

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

• _blank — загружает документ в новое окно;
• _self — загружает документ в текущий фрейм;
• _parent — загружает документ во фрейм, занимаемый родителем, если фрейма-родителя нет значение действует также, как _top ;
• _top — отменяет все фреймы и загружает документ в полное окно браузера.

HTML по теме

Не выкладывайте свой код напрямую в комментариях, он отображается некорректно. Воспользуйтесь сервисом cssdeck.com или jsfiddle.net, сохраните код и в комментариях дайте на него ссылку. Так и результат сразу увидят.

Популярные рецепты

• Как добавить картинку на веб-страницу?
• Как добавить иконку сайта в адресную строку браузера?
• Как добавить фоновый рисунок на веб-страницу?
• Как сделать обтекание картинки текстом?
• Как растянуть фон на всю ширину окна?
• Как выровнять фотографию по центру веб-страницы?
• Как разместить элементы списка горизонтально?
• Как убрать подчеркивание у ссылок?
• Как убрать маркеры в маркированном списке?
• Как изменить расстояние между строками текста?
• Как сделать, чтобы картинка менялась при наведении на нее курсора мыши?
• Как открыть ссылку в новом окне?

Популярные задачи

• TEX
• Отступы между блоков
• Андроид в тени
• Ссылка как кнопка
• Вложенные списки
• Форма регистрации
• Объединение ячеек таблицы
• Обязательные поля формы
• Цвет и фон в таблице
• Асуанская плотина
• Батарейка
• Заголовки

Источник