logo
ВебТех Конспект лекций 2011 укр

Активні зображення

Активні зображення (image maps), або зображення, чутливі до клацаннях миші, дозволяють створити на вузлі графічні меню довільної форми. Активне зображення - це зображення з так званими активними областями (hot spots), які посилаються на URL інших сторінок або вузлів.

Є два методи формування активних зображень: на сервері і у клієнта. Зображення першого типу використовують сервер для того, щоб знайти відповідний даній активної області URL і передати на браузер потрібну сторінку. Активні зображення, що працюють на клієнтській машині, задають інформацію про активну області на НТМL-сторінці, так що браузер сам з'ясовує, які області є активними, і запитує з сервера відповідну сторінку.

Активні зображення, що працюють у клієнта, мають кілька переваг. По-перше, сторінки з ними можна перенести на інший сервер. По-друге, серверу не доводиться виконувати зайву роботу (наприклад, переглядати всю інформацію про активні областях), тобто навантаження на сервер зменшується. При використанні працюють на сервері активних зображень у каталозі СGI-bin сервера повинен бути відповідний сценарій. З міркувань безпеки багато системні адміністратори не записують сценарії в каталог СGI-bin. Тому більш детально ми розглянемо створення активних зображень у клієнта.

Створення активного зображення. Процес створення активного зображення складається з двох етапів. Спочатку необхідно визначити на картинці області, які потрібно зробити активними, а потім співвіднести їх з посиланнями на інші URL. Активні області задаються перерахуванням їхніх координат (у пікселях). Все це можна зробити вручну, визначивши координати кутів активних областей, але набагато простіше скористатися якою-небудь програмою, наприклад МарЕdit.

Визначити карту легко. Потрібно відкрити в МарEdit HTML-файл, що містить зображення, на якому потрібно створити активні області, після чого вибране зображення буде завантажено в робоче вікно. Потім слід вибрати тип активної області (квадрат, трикутник і коло), клацнути і потягнути мишкою, позначивши границю області. Програма автоматично проводить запис в HTML-файл, що описує границі активної області. Потім цій галузі потрібно приписати URL. У будь-яких місцях зображення можна намалювати активні області та визначити для кожної з них URL. Важливо залишати між областями небагато місця, щоб при читанні бути впевненим, що активізується правильна посилання. Межі активних областей задаються координатами кутів прямокутника і багатокутника або центру і радіусу кола. Якщо ви вирішили робити активне зображення у клієнта, Map Edit постачає дані тільки для тегів <MAP>. Вам доведеться самим задати тег зображення з атрибутом USEMAP і помістити його після тега </ MAP>. Не забудьте перед ім'ям карти в атрибуті USEMAP записати символ "#" наступним чином:

<IMG SRC="mymap.gif" USEMAP="#sitemap">

Активні зображення в клієнта працюють незалежно від програмного забезпечення сервера і не перестануть функціонувати, навіть якщо файли будуть перенесені на інший сервер. Таким зображень потрібні тільки дві речі: браузер, що підтримує HTML 3.0, і інформація про карту, записана в HTML-файлі. Наведемо приклад активних зображень.

<IMG SRC="image.gif" ALT="Ізображенія" USEMAP="#imap">

<MAP NAME="imap">

<AREA SHAPE = "rect" COORDS = "0,0,100,100" HREF = "http://www.snu.edu.ua/help/../index.html">

<AREA SHAPE = "rect" COORDS = "100,0,200,100" HREF = "http://www.snu.edu.ua/shop / ../index.html ">

<AREA SHAPE="default" nohref>

</ MAP>