Institute на машине пользователя:

file:/spb/institute/document.html

Метод http  Метод http предоставляет доступ к веб-странице по протоколу

HTTP Это наиболее часто используемый метод доступа к HTML-документам

в Сети Например, следующая запись открывает доступ к домашней странице

компании Russian:

http://www.russian.com/

Метод ftp  Методом ftp выполняется запрос к FTP-серверу на получение фай-

ла, например:

ftp://myname/directory/ninaname

Метод mailto  Метод mailto активизирует сеанс почтовой связи с указанными

пользователем и хостом Например, следующая запись активизирует отправку

сообщения пользователю ninapetergof на машине spb.com, если браузер поддер-

живает запуск электронной почты:

mailto: ninapetergof@spb.com

При использовании метода mailto слэши после двоеточия указывать не нужно

Как правило, после двоеточия сразу вводится адрес электронной почты або-

нента

Метод telnet  Метод telnet используется для обращения к службе telnet

Метод news  Метод news обеспечивает вызов службы новостей, если браузер

поддерживает такой вызов Например:

news:relcom.www.support

Как и в случае метода mailto, при использовании метода news слэши после двое-

точия указывать не нужно Как правило, после двоеточия сразу вводится адрес

группы новостей

Имя сервера — необязательный параметр URL, описывающий полное сетевое имя

машины Например, www.piter.com — полное сетевое имя сервера издательства

«Питер» Если имя сервера не указано, то ссылка считается локальной, и полный

путь, указанный далее в URL, относится к той же машине, на которой находится

HTML-документ, содержащий ссылку Вместо символьного имени сервера мо-

жет быть использован IP-адрес, однако это не рекомендуется из-за возможного

конфликта имен с фиксированными локальными адресами внутренней сети   Вставка ссылок в документ   193

Следом за именем сервера в URL указывается номер порта TCP, на котором

функционирует веб-сервер Если порт не указан, по умолчанию используется

порт 80 (что характерно для подавляющего большинства URL-адресов)

Далее в URL указывается частичный или полный путь к документу, который дол-

жен вызываться в результате перехода по ссылке

Якорь — это ссылка на место внутри текущего HTML-документа Как будет по-

казано далее, места в документе, на которые ссылается якорь, указываются в до-

кументе при помощи атрибута NAME

Текст URL-адреса не отображается браузером, а используется только для вы-

полнения предписанных им действий при активизации ссылки (обычно щелчком

мыши)

Вставка ссылок в документ

Для вставки ссылок в документ используется парный тег <А> Этот же тег позво-

ляет вставить в документ якорь Тег <А> имеет атрибуты HREF, NAME, ID, METHODS,

FRAME, TITLE, ACCESSKEY

Ниже перечислены атрибуты тега <А>

Атрибут HREF  При вставке ссылки в документ обязательно указывается

атрибут HREF Значением атрибута является URL-адрес документа, на который

указывает ссылка:

<a href="url">

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

<A> и </A>, специальным образом выделяется веб-браузером (обычно подчер-

кивается и выделяется синим цветом)

Атрибут NAME  Атрибут NAME указывается вместо атрибута HREF при вставке

якоря в документ (см раздел «Переходы внутри документа»)

Атрибут ID  Атрибут ID идентичен атрибуту NAME с той разницей, что может

вставляться в другие теги, а не только в тег <A>, например:

<p id="имя абзаца">

При наличии такой пометки ссылка на нее в текущем документе может быть

создана следующим образом:

<a href="#имя абзаца"> ссылка</a>

Атрибут METHODS  Атрибут METHODS задает метод извлечения документа,

например, FTP, Gopher и т д Синтаксис:

<A METHODS="название"> необязательный текст </A>

Атрибут FRAME  Атрибут FRAME позволяет указать фрейм, в котором должен

быть визуализирован целевой документ Синтаксис:

<a frame="имя фрейма"> необязательный текст </a>

Атрибут TITLE  Атрибут TITLE служит для визуализации подсказки Синтаксис:

<a title="имя ссылки"> ССЫЛКА</a>194     Урок 11. Ссылки

Атрибут ACCESSKEY  Атрибут ACCESSKEY позволяет указать «горячую» клави-

шу, при нажатии которой будет выполнен переход по ссылке Синтаксис:

<a accesskey="имя клавиши"> ССЫЛКА</a>

Ниже перечислены некоторые примеры ссылок

Ссылка на HTML-файл с использованием протокола HTTP: 

<a href="http://www.mizic.ru/alex/lena/page1.html"> ССЫЛКА </a>

Ссылка на ZIP-файл с использованием протокола HTTP: 

<a href="http://www.mizic.ru/alex/lena/test.zip"> ССЫЛКА </a>

Ссылка на TXT-файл с использованием протокола HTTP: 

<a href="http://www. mizic.ru/alex/lena/test.txt"> ССЫЛКА </a>

Ссылка на MPG-файл с использованием протокола HTTP: 

<a href="http://www.mizic.ru/alex/lena.mpg"> ССЫЛКА </a>

Ссылка на EXE-файл с использованием протокола FTP: 

<a href="ftp://ftp.spbszip.com/pub/priem/priem/install.exe"> ССЫЛКА </a>

Ссылка, инициирующая создание сообщения электронной почты: 

<a href="mailto:name@domen.ru"> ССЫЛКА </a>

Ссылка, инициирующая создание сообщения электронной почты с автомати- 

чески введенной темой сообщения:

<a href="mailto:name@domen.ru, subject=Teмa"> ССЫЛКА </a>

Ссылка, инициирующая создание сообщения электронной почты с автомати- 

чески введенными темой и текстом сообщения:

<a href="mailto:name@domen.ru, SUBJect=Teмa &body=Тeкст"> ССЫЛКА </a>

Ссылка, инициирующая создание сообщения электронной почты с автомати- 

чески введенными темой и текстом сообщения, а также адресами для отправки

копии и скрытой копии:

<a href="mailto:name@domen.ru, SUBJECT=Teмa &body=Тeкст&cc=

name@domen.ru&bcc=name@domen.ru"> ССЫЛКА </a>

Ссылка на группу новостей: 

<a href="news:comp.infosystems.www.announce"> ССЫЛКА </a>

Эта ссылка будет работать только, если провайдер поддерживает доступ

к группам новостей

При наведении указателя мыши на ссылку он меняет свою форму, превращаясь

в изображение кисти руки

Внутренние ссылки

Внутренние ссылки указывают на другую веб-страницу текущего веб-узла Поэто-

му при создании внутренней ссылки в атрибуте HREF тега <A> достаточно указать

относительный путь поиска

Пример документа, содержащего внутренние ссылки, показан на рис 11 1 (лис-

тинг 11 1)   Внешние ссылки   195

Рис 11 1  Документ с внутренними ссылками

Листинг 11 1  Пример создания внутренних ссылок

<html>

<head><title>Лекции по информатике</title></head>

<body background=ffffff>

<center><h1>лекции по информатике</h1></center>

<hr noshade size=10 width="100%" align=center>

<p><h2><a href="Лекция1.htm">лекция 1</a></p>

<p><a href="Лекция2.htm">лекция 2</a></p>

<p><a href="Лекция3.htm">лекция 3</a></p></h2>

</body></html>

Внешние ссылки

Внешние ссылки указывают на веб-страницы, не расположенные на текущем веб-

узле Поэтому в атрибуте HREF тега <A> необходимо указывать полный URL-адрес

документа, включая название протокола и адрес веб-узла

Если файлы Лекция1.htm, Лекция2.htm и Лекция3.htm разместить в каталоге

C:/Nina/HTML/, то код веб-страницы, представленной на рис 11 1, будет выглядеть

так, как показано в листинге 11 2

Листинг 11 2  Пример создания внешних ссылок

<!doctype html public "-//w3c//dtd html 4.0 transitional//en">

<html><head><title>ЛЕКЦИИ ПО ИНФОРМАТИКЕ</title>

<meta http-equiv=content-type content="text/html; charset=windows-1251">

<meta content="mshtml 6.00.2600.0" name=generator></head>

<body background="">196     Урок 11. Ссылки

<center>

<h1>лекции по информатике</h1></center>

<hr align=center width="100%" noshade size=10>

<h2><a href="file:///C:/Nina/HTML/Лекция1.htm">Лекция 1</a>

<p><a href="file:///C:/Nina/HTML/Лекция2.htm">Лекция 2</a></p>

<a href="file:///C:/Nina/HTML/Лекция3.htm">Лекция 3</a></h2>

</body></html>

Переходы внутри документа

Как уже отмечалось, ссылки можно делать не только на другие документы, но и на

различные фрагменты одного и того же документа Это позволяет быстро перехо-

дить от фрагмента к фрагменту внутри документа, не прибегая к прокрутке Для

организации таких переходов используются специальные якоря, которые обычно

вставляются в первую строку или в заголовок фрагмента, к которому должен вы-

полняться переход

При вставке якоря также используется тег <A>, но вместо атрибута HREF указы-

вается атрибут NAME Значением этого атрибута является имя якоря Оно может

состоять только из латинских букв и цифр и не должно содержать пробелов, на-

пример:

<a name="имя_якоря"> Переходы внутри документа </a>

Рис 11 2  Пример веб-страницы с якорями  Переходы внутри документа   197

Для ссылки на установленный якорь необходимо указать имя якоря в конце URL-

адреса после имени документа, отделив его символом #:

<a href=»#имя_якоря»> Ссылка </a>

Пример использования якоря приведен на рис 11 2 (листинг 11 3)

Листинг 11 3  Пример создания якорей в документе

<html><head><title>ПРИМЕР ЯКОРЯ</title></head>

<body background="#fff8dc">

<center>

<h1>Пример якоря</h1></center>

<p><b>Оглавление</b></p>

<ul> <li><a href="#glava1">Глава 1</a></li>

<li><a href="#glava">Глава 2</a></li> </ul>

<p><a name="glava"></a>Глава 1</p>

<il> <p>Текст главы 1</p> </ul>

<p><a name="glava"></a>Глава 2</p>

<ul> <p>Текст главы 2 <br></p>

</body></html>

Когда пользователь щелкнет мышью на ссылке Глава  1, браузер перейдет сразу

к первому разделу главы 1 Якорь может быть вставлен как в текущий, так и в дру-

гой документ Во втором случае браузер выполнит загрузку нового документа

и перейдет к указанному в нем разделу

Еще один пример страницы с внедренными якорями представлен на рис 11 3

(лис тинг 11 4)

Листинг 11 4  Еще один пример создания якорей в документе

<html><head><title>Пример создания якорей в большом документе</title></head>

<body bgcolor="#fffacd" topmargin=4 marginheight=4 leftmargin=100>

<center>

<h1>ДИЗАЙН</h1></center>

<p><b>Принципы дизайна</b></p>

<ul> <li><a href="#glava1"> 1. Что такое дизайн издания?</a></li><br>

<li><a href="#glava2">2.Принципы дизайна</a></li><br>

<li><a href="#glava3">3. Типичные ошибки </a></li><br>

<li><a href="#glava4">4. Объединение</a></li><br>

<li><a href="#glava5"> 5. Пропорции</a></li><br>

<li><a href="#glava5"> 6. Направление</a></li><br>

<li><a href="#glava6"> 7. Единство стиля</a></li><br>

<li><a href="#glava8">8. Контраст</a></li><br></ul>

<p><a name="#glava1"> 1. Что такое дизайн издания?</a></p><br>

Словари иностранных слов трактуют дизайн как художественное конструирование предметов.

<br>

Еще одна формулировка: Дизайн есть художественное проектирование предметов и сред.<br>

Дизайн - искусство оформления.<br>

Графический дизайн предназначен для того, чтобы было красиво.<br>

Дизайн - вид художественной деятельности, проектирование изделий, обладающих

эстетическими свойствами.<br>

<p><a name="#glava2"></a>2. Принципы дизайна </p>

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

на всех этапах подготовки публикации.<br>198     Урок 11. Ссылки

Принципы дизайна, которых следует придерживаться при создании веб-страницы:<br>

1. приближенность к цели;<br>

2. выравнивание;<br>

3. обзор;<br>

4. шрифт, типы шрифтов и контраст шрифтов;<br>

5. уместность,<br>

6. пропорциональность,<br>

7. контрастность,<br>

8. целостность,<br>

9. сдержанность,<br>

10. точность в деталях.<br>

Можно сказать и другими словами, что основными принципами дизайна являются:<br>

1. уместность;<br>

2. пропорции;<br>

3. направление;<br>

4. контраст;<br>

5. целостный образ;<br>

6. сдержанность;<br>

7. внимание к деталям.<br>

<p><a name="#glava3"></a>3. Типичными ошибками являются:</p>

1. Избыток визуальных доминант. <br>

</body></html>

Рис 11 3  Пример большой веб-страницы с якорями  Графические ссылки   199

Графические ссылки

Как вы помните (см урок 3), ссылкой может быть не только текст, но и изображе-

ние При этом код программы на языке HTML и изображение должны находиться

в одном каталоге

Пример графической ссылки показан на рис 11 4 (листинг 11 5) При щелчке на

изображении открывается файл Листинг 8.3.htm

Рис 11 4  Графическая ссылка

Листинг 11 5  Пример создания графической ссылки

<html><head><title>Памятник пушкину в городе пушкин</title></head>

<body bgcolor=#ffffff>

<h3 align=center>Памятник пушкину в городе Пушкин</h3>

<p align=center><a href="Листинг 8.3.htm">

<img src="Памятник Пушкину в городе Пушкин.jpg"></font> </a></p>

</body></html>

Рис 11 5  Графическая ссылка при отсутствии изображения200     Урок 11. Ссылки

Если изображение для ссылки и код программы на языке HTML находятся в раз-

ных каталогах, то вместо изображения на экране появится квадрат с красным кре-

стом посередине (рис 11 5) При этом сама ссылка останется работоспособной, то

есть при щелчке на ней произойдет переход по указанному URL-адресу

Подведем итоги

В этом уроке рассказывается о вставке в документ ссылок, делающих веб-страницы

привлекательными для пользователей Вы познакомились с разными типами

ссылок, в том числе с внешними ссылками, реализующими переходы между веб-

узлами, с внутренними ссылками, реализующими переходы между документами

одного веб-узла, со ссылками, реализующими переходы внутри документа, с гра-

фическими ссылками, в которых роль активной части исполняет не текст, а изо-

бражение Урок 12 Технологии XML,

XHTML, DHTML

Языки XML, XHTML, DHTML появились одновременно и в качестве аль-

тернативы HTML и, несомненно, имеют право на существование. Их 

достоинства и недостатки можно долго обсуждать. В данном уроке 

приведем  основные  сведения  об  этих  языках,  а  более  подробную 

информацию  можно  найти  на  сайте  http://www.w3schools.com.

Урок202     Урок 12. Технологии XML, XHTML, DHTML

Технология XML

XML (EXtensible Markup Language — расширенный язык разметки) — текстовый

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

данными между разными системами обработки информации Он представляет

собой набор общих синтаксических правил

Наиболее важные черты XML:

XML — язык гипертекстовой разметки, ориентированный на описание струк- 

турированных данных;

XML позволяет использовать не только предопределенные теги, но и вводить 

свои собственные теги;

XML не зависит от платформы 

XML является разработкой корпорации W3C (спецификация языка была утверж-

дена 10 февраля 1998 года)

Если наш читатель листает страницы этой книги и мечтает создать веб-страницу

на языке HTML, то мы просто уверены в том, что следующим его желанием будет

создание веб-страницы на языке PHP (PHP: Hypertext Preprocessor) с использо-

ванием AJAX (Asynchronous JavaScript And XML) AJAX — это не новый язык

программирования, а новая технология для создания лучшего, удобного и более

интерактивного веб-приложения Сразу становится ясным, что следует разобрать-

ся и в том, что такое XML

Когда в 1986 году появился язык SGML (Standard Generalized Markup Language —

стандартный обобщенный язык разметки), то веб-страницы создавались на этом

гибком, комплексном и всеохватывающем метаязыке Но его сложность и, как

следствие, дороговизна привели к тому, что потребовался более простой язык соз-

дания веб-страниц, которым успешно стал язык HTML Однако со временем по-

считали, что HTML прост и это стало его главным недостатком Ограниченность

количества тегов и полное безразличие к структуре документа побудили разра-

ботчиков в лице консорциума W3C к созданию такого языка разметки, который

был бы не столь сложен, как SGML, и не настолько примитивен, как HTML В ре-

зультате на свет появился язык XML, сочетающий в себе простоту HTML, логику

разметки SGML и удовлетворяющий требованиям Интернета

Однако не забудьте, что для создания документов на языке XML следует найти

и использовать специальную программу — редактор XML Скорее всего ее можно

найти у ваших друзей или «скачать из Интернета»

Пример использования XML, приведенный в листинге 12 1 (показан на рис 12 1),

является обращением ПРЕПОДАВАТЕЛЯ к СТУДЕНТАМ:

Листинг 12 1  Пример создания веб-страницы на языке XML

<?xml version="1.0" encoding="UTF-8"?>

<note>

<to>ПРЕПОДАВАТЕЛЬ</to>

<from>СТУДЕНТАМ</from>

<heading>ЖИЗНЕННАЯ ПОЗИЦИЯ</heading>

<body>УЧЕНЬЕ – СВЕТ, А НЕУЧЕНЬЕ - ТЬМА!</body>

</note>  Технология XHTML   203

Рис 12 1  Веб-страница на языке XML

В этом примере такие теги, как <note>, <heading>, <to> и <from>, не являются стан-

дартными XML-тегами, а придуманы авторами XML-документа

Если код программы на языке HTML создается в обыкновенной программе (на-

пример, в Блокноте), то код программы на языке XML создается в специальном

XML-редакторе, который предварительно следует инсталлировать Существует

достаточно много бесплатных XML-редакторов, их можно легко найти в Интер-

нете В настоящее время технология XML является достаточно модной и многие

программисты ее используют

Технология XHTML

Язык XHTML является комбинацией HTML и XML XHTML использует теги

HTML 4 01 в сочетании со строгим синтаксисом XML Таким образом, XHTML —

это более строгая версия HTML

Наиболее важные отличия XHTML от HTML:

XHTML-элемент должен размещаться в тегах; 

XHTML-тег должен всегда иметь закрывающийся тег; 

XHTML-тег должен быть записан в нижнем регистре; 

XHTML-документ должен иметь один корневой элемент 

В листинге 12 2 приведен пример шаблона простейшего XHTML-документа (по-

казан на рис 12 2):

Листинг 12 2  Пример создания веб-страницы на языке XHTML

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"

"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" lang="ru" xml:lang="ru">

<head><title>Название страницы</title></head>

<body><p>Содержимое страницы</p></body></html>204     Урок 12. Технологии XML, XHTML, DHTML

Рис 12 2  Простейший XHTML-документ

Рисунок получился малоинформативным только из-за того, что документ XHTML

оказался простейшим

Объявление XHTML-документа может быть нескольких типов:

XHTML 1 0 Strict (Строгий): 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"

"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

XHTML 1 0 Transitional (Промежуточный): 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"

"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

XHTML 1 0 Frameset (Структурный): 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN"

"http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd">

Технология DHTML

Dynamic HTML — усовершенствованная версия HTML, которая поддерживает

объектную модель документа (Document Object Model) Наряду с возможностя-

ми форматирования DHTML поддерживает условную логику и динамическое вы-

полнение В листинге 12 3 приведен пример DHTML-документа, в котором нажа-

тие на кнопку управляет отображением/скрытием текста (показан на рис 12 3)

Рис 12 3  Управление отображением текста: а — исходный документ; б — со скрытым текстом

а б  Технология DHTML   205

Листинг 12 3  Пример веб-страницы, управляющей отображением текста

<html>

<head><title>УПРАВЛЕНИЕ Отображением Текста</title></head>

<body><p id="p1">DYNAMIC HTML — УСОВЕРШЕНСТВОВАННАЯ ВЕРСИЯ HTML,

КОТОРАЯ ПОДДЕРЖИВАЕТ ОБЪЕКТНУЮ МОДЕЛЬ ДОКУМЕНТА

(DOCUMENT OBJECT MODEL)</p>

<input type="button" value="СКРЫТЬ ТЕКСТ"

onclick="document.getElementById('p1').style.visibility='hidden'" />

<input type="button" value="ОТОБРАЗИТЬ ТЕКСТ"

onclick="document.getElementById('p1').style.visibility='visible'" />

</body></html>

В листинге 12 4 приведен пример DHTML-документа, в котором изменяется

содержание текста при наведении на него курсора мыши На рис 12 4 приве-

ден первоначальный документ — а, его вид после наведения курсора мыши на

надпись — б и после того как курсор покинул надпись — в

Рис 12 4  Управление отображением текста: а — исходный документ; б — вид после наведения 

курсора мыши на надпись; в — и после того как курсор покинул надпись

Листинг 12 4  Пример изменения текста при наведении на него курсора

<html>

<head><script type="text/javascript">

function nameon()

{

document.getElementById('h2text').innerHTML="ТОЧКА ЕСТЬ ТО, ЧТО НЕ ИМЕЕТ ЧАСТЕЙ";

}

function nameout()

{

document.getElementById('h2text').innerHTML="ЛИНИЯ ЕСТЬ ДЛИНА БЕЗ ШИРИНЫ";

}

а б

в206     Урок 12. Технологии XML, XHTML, DHTML

</script></head>

<body>

<h2 id="h2text" onmouseout="nameout()"

onmouseover="nameon()">

НАВЕДИТЕ КУРСОР НА ЭТОТ ТЕКСТ!!!</h2>

</body></html>

В листинге 12 5 приведен пример DHTML-документа, содержащего движущийся

текст, раздвигающий границы документа (показан на рис 12 5) В этом примере

текст движется очень интересно Слово «АКСИОМА» движется вправо, а слово

«ЛЕММА» движется вниз

Рис 12 5  Пример движущегося текста

Листинг 12 5  Пример движущегося текста

<html><head>

<script type="text/javascript">

var i=1

function starttimer()

{

document.getElementById('h_one').style.position="relative";

document.getElementById('h_one').style.left=+i;

document.getElementById('h_two').style.position="relative";

document.getElementById('h_two').style.top=+i;

i++;

timer=setTimeout("starttimer()",10);

}

function stoptimer()

{

clearTimeout(timer);

}

</script></head>

<body onload="starttimer()" onunload="stoptimer()">

<h1 id="h_one">АКСИОМА</h1>

<h1 id="h_two">ЛЕММА</h1>

</body></html>  Технология DHTML   207

В листинге 12 6 приведен пример DHTML-документа (показан на рис 12 6), в ко-

тором при движении курсора мыши по экрану будет перемещаться рисунок (файл

рисунка, например БЕЛКА.jpg, должен находиться в этой же папке, что и документ

веб-страницы)

Рис 12 6  Пример передвижения рисунка вместе с курсором

Листинг 12 6  Пример движущейся за курсором картинки

<html><head>

<script type="text/javascript">

function cursor(event)

{

document.getElementById('trail').style.visibility="visible";

document.getElementById('trail').style.position="absolute";

document.getElementById('trail').style.left=event.clientX+10;

document.getElementById('trail').style.top=event.clientY;

}

</script></head>

<body onmousemove="cursor(event)">

<h1>ПЕРЕДВИГАЙТЕ КУРСОР ПО СТРАНИЦЕ</h1>

<img id="trail" style="visibility:hidden" src="БЕЛКА.jpg" width="300" height="300">

</body></html>

В листинге 12 7 приведен пример DHTML-документа, в котором нажатие на кноп-

ку управляет дрожанием окна Windows Исходный документ показан на рис 12 8

Дрожание окна трудно отразить на рисунке, поэтому поверьте на слово, создайте

страницу и посмотрите сами 208     Урок 12. Технологии XML, XHTML, DHTML

Рис 12 7  Управление дрожанием окна WINDOWS

Листинг 12 7  Пример управления дрожанием окна WINDOWS

<html><head>

<script>

function startEQ()

{

richter=5;

parent.moveBy(0,richter);

parent.moveBy(0,-richter);

parent.moveBy(richter,0);

parent.moveBy(-richter,0);

timer=setTimeout("startEQ()",10);

}

function stopEQ()

{

clearTimeout(timer);

}

</script></head>

<body><form>

<input type="button" onclick="startEQ()" value="НАЧАТЬ ДРОЖАНИЕ"><br />

<br /><input type="button" onclick="stopEQ()" value="ОСТАНОВИТЬ ДРОЖАНИЕ">

</form></body></html>

В листинге 12 8 приведен пример DHTML-документа, в котором появление/ис-

чезновение текста управляется двойным щелчком кнопки мыши при наведении

курсора на надпись (показан на рис 12 8)

Листинг 12 8  Появление надписи при двойным щелчке кнопки мыши 

<html><head>

<script type="text/javascript">

function gettip(txt)

{

document.getElementById('tip').innerHTML='Организация W3Schools является разработчиком

стандартов для World Wide Web';

}

</script></head>

<body>

<p>ДВАЖДЫ ЩЕЛКНИТЕ ПО НАДПИСИ"W3Schools.com"</p>  Подведем итоги   209

<table>

<tr>

<th ondblclick="gettip()" valign="top">W3Schools.com</th>

<th id="tip"> </th>

</tr>

</table></body></html>

Рис 12 8  Появление надписи при двойным щелчке кнопки мыши

Подведем итоги

В этом уроке приведены начальные сведения о создании веб-страниц на языках