Карти зображень
Карти — це спосіб зробити різні частини одного графічного зображенн гіперпосиланнями. Вони дозволяють виділити окремі області зображень і визначити для кожної з них свою дію.
Щоб створити карту потрібно вставити в <IMGтег SRC=""> атрибут USEMAP="#name", де name - ім'я карти (значок # обов'язковий). У прикладі використовувалася назва Map_example.
Далі описуємо активні області карти. Починаємо відкриваючого тега<MAP NAME="name"> (тут повторюється ім,'я але вже без значка#), а закінчуємо замикаючим тегом </MAP>.
Між цими тегами поміщаємо опис кожної активної області зображення: <AREA
SHAPE="форма" COORDS="координати" HREF="адреса" TITLE="альтернативний текст">. Елемент <AREA> має наступні атрибути і їх значення:
Таблиця 1
Атрибути елементу <AREA>
Описує форму області, що виділяється, можливі значення: RECT - прямокутник
SHAPE
CIRCLE - круг
POLY - багатокутник
DEFAULT - визначає всю область, т.е весь малюнок може стати посиланням.
Координати, що визначають розміри і положення області на зображенні. Всі координати відлічуються в пікселях від лівого верхнього кута зображення. Кількість і порядок значень залежить від значення атрибута SHAPE:
COORDS
RECT: - лівий-X, верхній-Y, правий-X, нижній-Y (тобто спочатку координати лівого верхнього кута, потім правого нижнього) CIRCLE: - центр-X, центр-Y, радіус (тобто горизонтальна і вертикальна координати центру круга і радіус)
POLY: - X1, Y1, X2, Y2 ..., Xn, Yn (просто перераховуються координати всіх вершин багатокутника).
Визначає, що даній області не відповідає ніяке посилання. Де це NOHREF може стати в нагоді? Ну, наприклад, якщо ви хочете зробити
посилання не у вигляді круга, а у вигляді кільця
ALT
Альтернативний текст для виділеної області, використовується невізуальними браузерами.
TITLE
Назва виділеної області, виводиться у вигляді підказки, спливаючої при наведенні курсора на область малюнка.
TARGET
Значення цього атрибута ("_top", "_blank", "_self" або "_parent")
визначає, в якому вікні буде відкритий документ
5
У лістингу4 представлений код карти зображення, що дозволяє проглянути детальніше визначні пам'ятки США, Парижа, Фінляндії і Англії, вибираючи частину великої фотографії. Фотографія розділена на чотири прямокутники (мал. 4)
Мал. 4 Приклад карти зображення
Лістинг 4. Приклад створення карти зображення з активними областями у вигляді прямокутників
<html><head><title>menu-karta</title></head> <body bgcolor=#ffbcbc>
<center> <h1>Достопримечательности</h1> <HR>
<table border=2> <TR>
<TD><A HREF=1.HTML> Тауерський міст в Англії </A> <TD><A HREF=2.HTML> Гарвардський університет в Сша</a> <TD><A HREF=3.HTML> Готичний собор в Паріже</a>
<TD><A HREF=4.HTML> Театр у Фінляндії</a> </table><HR></Center>
<A NAME = map> <H2>Графические ссылки</H2>
6