HTML, XHTML и CSS на 100%
Шрифт:
• height – высота окна в пикселах.
• toolbar – если параметр имеет значение yes или 1, окно снабжается стандартной панелью инструментов. Если же значение этого параметра равно no, то панель инструментов в новом окне не отображается.
• location – параметр определяет, будет ли отображаться поле ввода адреса HTML-документа (адресная строка).
• status – отображение строки состояния.
• menubar – отображение строки меню.
• scrollbars – отображение полос прокрутки.
• resizable – если этот параметр указан как yes или 1, пользователь сможет изменять размер вновь созданного окна.
Все атрибуты параметра config перечисляются через запятую без пробелов и заключаются в одинарные кавычки, поскольку являются подкомандами.
Примечание
Помните, что пробел для браузера означает конец команды.
Теперь рассмотрим примеры сценариев, использующих метод open (листинги 10.7 и 10.8).
<html>
<head>
<title>Метод open</title>
</head>
<body>
<script language="JavaScript">
<!– Маскировка сценария
window.open('okno2.html', 'joe',config='height=250,width=300,toolbar= no,menubar=no,scrollbars=no,resizable=yes,location=no,status=yes')
window.name="main window"
// Конец маскировки сценария –>
</script>
</body>
</html>
<html>
<head>
<title>Метод open</title>
</head>
<body>
<a href="#" TARGET="main window">Yandex</a>
<a href="" onClick="window.close">Щелкните, чтобы закрыть</a>
</body>
</html>
Сценарий в файле okno.html открывает документ okno2. html в новом маленьком окне браузера (рис. 10.7).
Рис. 10.7. Новое окно браузера
Это окно имеет размеры 300 х 250 пикселов, в нем не отображаются меню, панель инструментов, адресная строка и полоса прокрутки. За это отвечают значения атрибутов параметра config, равные no. В новом окне отображается только строка состояния, что определяется атрибутом status=yes. Кроме того, пользователь может изменять размеры нового окна. За это отвечает атрибут resizable=yes.
Обратите внимание на строку window.name="main window". Здесь использовано свойство name объекта Window, а main window – это имя главного (большого) окна. Вместо window.name можно написать self.name. Результат будет тот же самый, поскольку window и self – синонимы.
В новое окно загружается документ okno2.html, содержащий две ссылки. Одна ссылка загружает главную страницу сайта поисковой системы «Яндекс» в большом окне браузера, имя которому main window. Этого результата мы добились благодаря команде target="main window". Если необходимо, чтобы страница загружалась в маленьком окне, просто напишите j oe вместо main window. Другая ссылка позволяет закрыть маленькое окно благодаря обработчику события onCli ck и методу close: onClick="window.close".
Совет
При открытии новых окон ставьте сценарий ближе к концу HTML-документа. Причина проста: сначала загрузится веб-страница, а потом всплывет окошко. Если команда стоит в начале HTML-документа, то окошко всплывет прежде, чем пользователь увидит вашу страницу. Он может закрыть новое окно, не успев им воспользоваться.
Рассмотрим следующий метод объекта Window – setTimeout. С его помощью вы можете запрограммировать компьютер на выполнение определенных команд по истечении некоторого времени.
При использовании описываемого метода применяется следующий синтаксис: setTimeout ("cmd", timeout). Когда пройдет время, заданное параметром timeout (в миллисекундах), запускается команда JavaScript, определенная параметром cmd.
Пример сценария, содержащего метод setTimeout, приведен в листинге 10.9.
<html>
<head>
<title>Метод setTimeout</title>
<script language="JavaScript">
<!– Маскировка сценария
function timer //функция
{
idTimer=window.setTimeout("alert('Время истекло!')", 3000);
}
// Конец маскировки сценария –>
</script>
</head>
<body>
<form> //форма
<input type="button" value="Timer" onClick="timer">
</form>
</body>
</html>
Данный HTML-документ содержит сценарий и форму с кнопкой Timer. При нажатии кнопки открывается окно Alert с задержкой в три секунды (рис. 10.8).
Рис. 10.8. Окно Alert с сообщением
Здесь setTimeout – это метод объекта Window. Он определяет интервал времени в 3000 миллисекунд (3 секунды) и команду, которая должна быть выполнена по истечении этого времени. В данном случае это вызов окна с сообщением с помощью метода alert: «alert(Время истекло!)». Обратите внимание, что код на JavaScript должен быть обязательно заключен в кавычки, а время указывается в миллисекундах и без кавычек.