КАТЕГОРИИ:
АстрономияБиологияГеографияДругие языкиДругоеИнформатикаИсторияКультураЛитератураЛогикаМатематикаМедицинаМеханикаОбразованиеОхрана трудаПедагогикаПолитикаПравоПсихологияРиторикаСоциологияСпортСтроительствоТехнологияФизикаФилософияФинансыХимияЧерчениеЭкологияЭкономикаЭлектроника
|
Пример 1. Использование карты-изображения<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <title>Карта-изображение</title> </head> <body> <p><img src="images/map.gif" width="411" height="46" usemap="#map" alt="Навигация"></p> <p><map name="map"> <area shape="poly" alt="Закладка 2" coords="210,27, 203,9, 202,6, 197,2, 192,1, 120,1, 115,2, 110,6, 112,9, 119,27, 119,32, 211,32, 210,27" href="2.html"> <area shape="poly" alt="Закладка 3" coords="302,27, 295,9, 293,6, 289,2, 283,1, 212,1, 206,2, 202,6, 203,9, 210,27, 211,32, 284,32, 303,32, 302,27" href="3.html"> <area shape="poly" alt="Закладка 4" coords="302,27, 303,32, 394,32, 393,27, 386,9, 382,3, 375,1, 303,1, 298,2, 293,6, 295,9, 302,27" href="4.html"> </map></p> </body> </html>
Для указания браузеру, что изображение является картой, применяется атрибут usemap. Он является ссылкой на описание конфигурации карты, которая задается тегом <map>. Значение атрибута name данного тега должно соответствовать имени в usemap. Для задания активой области, являющейся ссылкой на HTML-документ, используется тег <area>. Атрибуты тега AREA Shape Определяет форму активной области. Форма может быть в виде окружности (circle), прямоугольника (rect), полигона (poly). Alt Добавляет альтернативный текст для каждой области. Служит лишь комментарием для ссылки, поскольку на экран не выводится. Coords Задает координаты активной области. Координаты отсчитываются в пикселах от левого верхнего угла изображения, которому соответствует значение 0,0. Первое число является координатой по горизонтали, второе — по вертикали. Список координат зависит от формы области. Для окружности задаются три числа — координаты центра круга и радиус. <area shape="circle" coords="230,340, 100" href="circle.html"> Для прямоугольника — координаты левого верхнего и правого нижнего угла. <area shape="rect" coords="24,18, 210,56" href="rect.html"> Для полигона задаются координаты его вершин (рис. 2). Рис. 2. Координатные точки для полигона Href Определяет адрес ссылки для области. Правила записи такие же, как и для тега <a>. Карты-изображения позволяют создавать ссылки на разные области одного изображения. Использование этого подхода наглядней, чем обычные текстовые ссылки и позволяет применять всего один графический файл для организации ссылок. Однако не нужно считать, что карты-изображения следует включать везде, где требуются графические ссылки. Прежде всего, следует оценить все доводы за и против, а также просмотреть альтернативные варианты.
|