4.2. Гіперпосилання у вигляді зображення, створення мапи посилань
Звичайно, зображення можуть бути гіперпосиланнями. Для цього їх слід помістити у контейнер <A>.
Наприклад, <A HREF="Приклад1.htm"> <IMG SRC="example.jpg"> </A>
Посиланням може бути також не тільки усе зображення, а і його частина. В цьому випадку зображення поділяється на частини і кожна частина є окремим гіперпосиланням. Цей метод має назву мапою посилань. Для створення мап посилань застосовується тег <MAP>, що має лише один атрибут NAME - ім’я мапи. Для визначення параметрів областей мапи використовується тег <AREA> , який має атрибути:
SHARE – визначає форму області посилання: rect – прямокутна, circle – кругова, poly – багатокутня.
COORDS – визначення координат області посилання. Координати визначаються у декартовій системі координат як відстань від лівого верхнього кута з координатами (0, 0) по осях X і Y. Якщо область посилання має прямокутну форму, координати визначаються як координати лівого верхнього кута і правого нижнього COORDS(х1. у1. х2. у2). Коли посилання має форму кола, його координати визначаються так – координати центру (х1,у1) і радіус (r). COORDS(х1. у1. r). Щоб визначити посилання багато кутньої форми, потрібно визначити координати усіх вершин, починаючи з будь-якої, причому наприкінці переліку слід ввести координати першої вершини.
HREF – адреса посилання.
Якщо зображення містить мапу посилань, то у тегу <IMG> потрібно визначати ім’я мапи за допомогою атрибуту USEMAP.
Приклад створення мапи посилань:
<HTML>
<HEAD>
<TITLE>Приклад створення мапи посилань</TITLE>
</HEAD>
<BODY BGCOLOR=#FFFFFF TEXT=#008090 TOPMARGIN=10 BOTTOMMARGIN=10 LEFTMARGIN=20 RIGHTMARGIN=20>
<BASEFONT SIZE=4>
<P ALIGN=CENTER> <I> <B>
Схема <BR> розташування навчальних корпусів <BR>
Донецького національного університету <BR>
економіки і торгівлі імені Михайла Туган-Барановського </B> </I> </P>
<MAP NAME="example">
<AREA SHAPE="rect" COORDS="194. 44. 284. 70" HREF="1.htm" TITLE="Адреса 1-го навчального корпусу">
<AREA SHAPE="rect" COORDS="10. 195. 100. 215" HREF="3.htm" TITLE="Адреса 3-го навчального корпусу">
<AREA SHAPE="rect" COORDS="145. 390. 245. 430" HREF="4.htm" TITLE="Адреса 4-го навчального корпусу">
<AREA SHAPE="rect" COORDS="390. 155. 480. 190" HREF="5.htm" TITLE="Адреса 5-го навчального корпусу">
<AREA SHAPE="rect" COORDS="300. 265. 395. 300" HREF="6.htm" TITLE="Адреса 6-го навчального корпусу">
</MAP>
<P ALIGN=CENTER>
<IMG SRC="Схема.jpg" BORDER=2 USEMAP="#example"> </P>
</BODY>
</HTML>
Рисунок 4.2 – Приклад мапи посилань
4.3. Біглий рядок
Біглий рядок створюється з використанням тегу <MARQUEE>, що має такі атрибути:
Атрибут BEHAVIOR визначає поведінку рядка на екрані, може приймати значення SCROLL – перетинає екран (значення за замовчуванням), SLIDE – текст висувається на екран і там залишається, ALTERNATE – рух у прямому та зворотному напрямах.
Атрибут BGCOLOR – колір фону.
Атрибут DIRECTION задає напрям руху, можливі значення: LEFT – зліва направо, RIGHT – навпаки.
Атрибут HEIGHT визначає висоту рядка у пікселях або у відсотках до розміру вікна.
Атрибут LOOP – кількість проходів рядка по екрану.
Атрибут SCROLLAMOUNT – швидкість переміщення тексту, приймає значення від 1 (наймаліша швидкість) до 2000.
У якості біглого рядка можна визначити також малюнок.
Наприклад,
<MARQUEE BEHAVIOR=ALTERNATE BGCOLOR=Red HEIGHT=10% SCROLLAMOUNT=10> Приклад </MARQUEE>
Приклад біглого рядка:
<MARQUEE> <IMG SRC="Людина.jpg"> </MARQUEE>
Контрольні питання
Які формати графічних файлів Вам відомі?
Як помістити у документ зображення?
Як визначити зображення як фоновий малюнок?
Що таке мапа посилань? Як її створити?
Як можна створити біглий рядок?
Практичні завдання
Варіант №1
Відредагувати сайт «Інформація про підприємство -//-» з використанням зображення, фонового малюнка, біглого рядка.
Варіант №2
Відредагувати сайт «Інформація про студентську групу -//-» з використанням зображення, фонового малюнка, біглого рядка.
Варіант №3
Відредагувати сайт «Інформація про комерційний банк -//-» з використанням зображення, фонового малюнка, біглого рядка.