Web Лекция 20

Лекция 20
Тема: Новые окна
Начнем с основ.
Скрипт
<SCRIPT LANGUAGE="javascript">
window.open('opened.html', 'joe', config='height=300,width=300');
self.name="main window";
</SCRIPT>
Разбор скрипта
Расположение на странице
Начнем с расположения скрипта на странице. До сих пор мы говорили, что лучше помещать
скрипты повыше, чтобы они первыми загружались в память компьютера и начинали работать без
задержки. Когда вы имеете дело с функцией, скрипт помещается между тэгами <HEAD>. Здесь мы
хотим сделать Вам другое предложение.
Если вы собираетесь открывать новое окно, ставьте скрипт ближе к концу документа. Проще
говоря, пусть он идет в последнюю очередь. Причина простая: сначала загрузится страница, а потом
всплывет окошко. Если команда открытия окна стоит в начале, то окошко всплывет прежде, чем
пользователь увидит вашу страницу. Скорее всего, он закроет новое окно, не успев им воспользоваться.
На самом деле, конечно, можно ставить скрипт куда угодно, и он будет работать. Просто мы
считаем, что чем позже откроется новое окно, тем лучше для Вас и для посетителей ваших страниц.
Не стоит злоупотреблять всплывающими окнами. Это иногда раздражает. Если же появление
нового окна оправдано, то хорошо бы предупредить об этом заранее.
window.open
Нельзя сказать яснее, чем это: window (окно) — объект, a open (открыть) — метод, который на него
воздействует.
Конфигурация нового окна
Информация об этом находится в круглых скобках. Вот схема, которой вы будете следовать:
('URL документа в новом окне', 'Название нового окна', config='параметры нового окна')
Сегодняшний образец:
('opened.html','joe',config='height=300,width=300')
opened.html — это URL страницы, которая появится в новом окне. Если страница располагается
на другом сервере, то добавьте http:// и так далее.
joe — название нового окна, config= указывает, что следующие команды относятся к
конфигурации нового окна.
Команды конфигурации
Они сообщают, что новое окно будет размером 300 на 300 пикселей.
Обратите внимание, что команды height (высота) и width (ширина) разделены только запятой без
пробелов, а значения поставлены в одинарные кавычки, так как эти два элемента являются
подкомандами config. Пробел для браузера означает конец команды. Ошибка!
Есть множество подкоманд для команды config. Про высоту и ширину вы уже знаете, они
определяются в пикселях. Остальные подкоманды употребляются со словами «yes» или «no» в
зависимости от того, нужны ли в новом окне эти элементы. (Можно ставить «1» вместо «yes» и «0»
вместо «no».) Помните, никаких пробелов между подкомандами и одинарные кавычки.
toolbar= отвечает за наличие панели инструментов c кнопками НАЗАД, ВПЕРЕД, СТОП и т.д.
menubar= отвечает за наличие строки меню с элементами ФАЙЛ, ПРАВКА, ВИД и т.д.
scrollbars= отвечает за наличие полосы прокрутки.
resizable= указывает, сможет ли пользователь изменить размер окна по своему желанию. Никогда
не ставьте здесь «нет», если только это не художественная инсталляция!
location= отвечает за наличие адресной строки, где виден URL страницы.
status= отвечает за наличие строки состояния.
Все вышеперечисленное называется характеристиками или атрибутами.
Тэги в новом окне
Всплывающее новое окно — это не просто рамка для страницы.

Как видите, далее мы поставили две ссылки. Первая открывает домашнюю страницу HTML
Goodies в главном окне. Вот как это получается:
<A HREF="http://www.htmlgoodies.com" TARGET="main window"></A>
У большого окна есть имя, «main window» (главное). Вот почему мы называли его главным. В
скрипте это обозначено строкой self.name="main window". Добавляем в ссылку HREF TARGET="…"
(цель) и указание на main window.
А если надо, чтобы страница загружалась в маленьком окошке? Что ж, как оно называется?
«joe». Помните? Просто нужно написать «joe» после команды target.
С помощью многократных команд window.open можно вызывать многократные окна. Только

следите за тем, чтобы у каждого нового окна было свое имя. Можете связывать окна ссылками при
условии, что правильно указываете имена окон в команде target.
Закрыть окно
Вторая ссылка нового окна закрыла его. Вот как это сделано:
<A HREF="" onClick="self.close()">Щелкните, чтобы закрыть</A>
Это обычная ссылка HREF, которая никуда не ведет. Видите пустые кавычки? Команда
onClick="self.close()" закрывает окно и никуда не ведет.
self (само, себя) — это свойство может относиться к любому объекту. В нашем случае это
свойство окна. Команда close (закрыть) закрывает окно.
Еще кое-что
Допустим, вы хотите открыть окно по команде, а не когда пользователь заходит на страницу. Вот
как это можно сделать:
<A HREF="les21.htm" onClick="window.open('opened.html', 'joe',
config='height=300,width=300')">Щелкните, чтобы открыть 'joe'</A>
И вот что у вас выйдет (если вы еще не закрыли маленькое окно, сделайте это, потому что ссылка
попытается его открыть):
Щелкните, чтобы открыть 'joe'
Это ссылка HREF, которая направлена на самое себя. Команда onClick делает работу, а
параметры содержатся в скобках ().
Ваше задание
Мы не показали Вам в действии все доступные характеристики окна, так что в качестве задания
напишите скрипт, который откроет новое окно со всеми характеристиками. Пусть оно будет размером
250 на 300 пикселей и с двумя ссылками:
 Одна откроет новую страницу в главном окне.
 Вторая откроет новую страницу в том же окне.
Страница, которая откроется в том же маленьком окне, должна содержать ссылку, закрывающую окно.

Web Лекция 20

Загружено:

Сведения о документе

Авторское право

Доступные форматы

Поделиться этим документом

Поделиться или встроить документ

Параметры публикации

Этот документ был вам полезен?

Это неприемлемый материал?

Авторское право:

Доступные форматы

Web Лекция 20

Загружено:

Авторское право:

Доступные форматы

Лекция 20

Тема: Новые окна

Конфигурация нового окна

Все вышеперечисленное называется характеристиками или атрибутами.

Тэги в новом окне

Всплывающее новое окно — это не просто рамка для страницы.

С помощью многократных команд window.open можно вызывать многократные окна. Только

Щелкните, чтобы открыть 'joe'

Вам также может понравиться