Создание активных зон

Теоретически картой ссылок может служить любое растровое изображение, записанное в одном из следующих форматов: GIF, JPEG или PNG. Но при ближайшем рассмотрении оказывается, что далеко не всякий графический образ способен успешно справиться с этой ролью. Практика работы с такими объектами позволила вывести несколько простых рекомендаций по выбору графической основы карты ссылок:

изображение должно иметь четкую структуру;
композиция образа не должна противоречить логике структурных составляющих и связей между ними;
желательно, чтобы рисунок состоял из хорошо различимых областей, окрашенных разными цветами;
из всех возможных форматов хранения графической информации следует предпочесть формат GIF, лучше без чередования строк.

Будем считать, что задача выбора графической основы карты ссылок успешно решена, а само изображение вставлено в документ. Далее требуется разделить будущую карту на области, чувствительные к щелчку мыши (активные области). Программа Dreamweaver поддерживает активные области трех видов: прямоугольники, окружности и многоугольники. Инструменты программы, предназначенные для их создания, являются упрощенными версиями аналогичных средств векторных графических редакторов. Работа с ними не представляет никаких технических сложностей.

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

Выберите изображение.
Откройте палитру Property Inspector (Инспектор свойств) (CTRL+F3). Если палитра свернута, разверните ее при помощи кнопки со стрелкой, расположенной в правом нижнем углу.

Введите имя карты в поле Map (Карта). Оно должно быть уникальным, состоять только из букв и цифр и начинаться с буквы.
В палитре Property Inspector (Инспектор свойств) выберите инструмент нужной формы. Кнопки инструментов расположены слева в нижней части палитры.
Нарисуйте активную область выбранной формы. После этого палитра изменит свой вид. Из всех разделов, показанных на Рисунок 8.6, останутся только поля, относящиеся к активным областям карты.

Pис. 5.6. Инструменты создания карты ссылок

В поле Link (Ссылка) введите адрес URL связанного документа или файла.
В списке Target (Назначение) выберите экранную область для вывода связанного документа. Это может быть отдельный фрейм или окно программы просмотра. Более подробно этот вопрос обсуждается в разделах, посвященных созданию ссылок и редактированию изображений.
В поле Alt (Альтернативный текст) ввести текстовый комментарий, относящийся к данной активной области карты. Напомним, что при наведении указателя на активную область этот текст выводится в виде всплывающей подсказки.
Повторите шаги 4-8 для создания дополнительных активных областей карты ссылок.
Закончите процедуру щелчком на любой свободной точке документа или нажатием клавиши ОК.

Редактирование карты ссылок

Карту ссылок, как практически любой другой объект, созданный средствами программы Dreamweaver, можно редактировать. Для этого программа предоставляет несколько простых приемов и инструментов, которые почти не отличаются от средств графического редактирования, входящих в обязательный минимум любого графического редактора средней руки. Приведем их краткое описание.

Карты ссылок можно передавать между документами при помощи буфера обмена.
Активную область разрешается перемещать. Для этого достаточно зацепить ее мышкой и перетащить в новое положение в пределах подложки. Для точного перемещения удобнее воспользоваться курсорными клавишами, каждое нажатие которых перемещает выбранную область на один пиксел в соответствующем направлении. Если при этом удерживать нажатой клавишу SHIFT, скорость перемещения возрастает в десять раз.

Чтобы выбрать активную область, достаточно щелкнуть по ней инструментом Pointer Hotspot (Указатель активной области). Он расположен слева в нижней части палитры свойств и имеет вид обыкновенной стрелки. Для группового выбора нескольких областей щелкнуть этим инструментом на каждой из них, удерживая нажатой клавишу SHIFT

Размеры активной области разрешается менять. Для этого надо выбрать ее инструментом Pointer Hotspot (Указатель активной области), зацепить опорный узел и перетащить его.

Для активных областей доступны все команды меню Modify > Arrange (Изменить > Расположить) и Modify > Align (Изменить > Выровнять). Перечислим их.

Align Left (Выровнять по левому краю). Выравнивает выбранные активные области по левому краю.
Align Right (Выровнять по правому краю). Выравнивает выбранные активные области по правому краю.
Align Top (Выровнять по верхнему краю). Выравнивает выбранные активные области по верхнему краю.
Align Bottom (Выровнять по нижнему краю). Выравнивает выбранные активные области по нижнему краю.
Make Same Width (Выровнять ширину). Ширина выбранных активных ных областей становится равной ширине той активной области, которая была выбрана последней.
Make Same Height (Выровнять высоту). Высота выбранных активных областей становится равной высоте той активной области, которая была выбрана последней.
Bring to Front (Перевести на передний план). Переводит выбранную активную область на передний план карты ссылок. В этом положении область имеет приоритет над всеми другими активными зонами, пересекающимися с ней.
Send to Back (Перевести на задний план). Переводит выбранную активную область на задний план карты ссылок.

Активные области карты ссылок предназначены для открытия внешних или внутренних ссылок в программе просмотра. Таков штатный режим работы с этими навигационными элементами. Иногда на них возлагают нестандартные функции своеобразных триггеров — переключателей,

запускающих динамические сценарии. Эти сценарии (они называются в программе behaviors — режимы) вносят в первоначально статичную Web-страницу элементы динамического поведения: выводят заданный текст в строке состояния броузера, меняют изображение, показывают или скрывают слои и пр. Умелое, дозированное применение этих простых динамических эффектов способно оживить страницу и сделать ее привлекательной.

С технической точки зрения, связывание сценария с активной областью выполняется так же, как для обычного изображения — средствами палитры Behaviors (Режимы). Разным активным областям разрешается присваивать различные динамические эффекты.

Содержание раздела