334 MGraphics.ru - CGI - Изображения ISMAP
Уроки photoshopa


CGI

Изображения ISMAP

Условия перепечатки материалов

Рейтинг статьи: 66666
Проголосовало 12 человек.
Оцените статью:

Изображения ismap


После такой серьезной темы как обработка форм,я перейду к чему-нибудь веселенькому. Я познакомлю вас с изображениями ismap потому что это просто есть такой способ. Да такие изображения используются в машиных дисках, а в частности bbs диски, очень симпатично выглядят под такой редакцией. Он поддерживается браузерами и естественно имеет право на жизнь.Хотя с приходом новых веяний в HTML (особенно Java-аплетов) он стал настоящей редкостью.И хотя можно в 80% случаев найти ему более быструю замену,все-же вы можете в некоторых случаях найти именно ismap предпочтительней всего.
Синтаксис очень простой,почти не отличается от того,если бы вы решили оформить рисунок для якорь гиперссылки:

<A href="cgi-bin/somescript.cgi"><IMG src="somepic.gif" border=0 ismap></A>

Заметьте что все отличие заключается в том,что в тэге IMG добавлен атрибут ismap. Он говорит браузеру,что когда пользователь щелкнет на картинке то нужно перейти не просто к URL указаному в <A href="URL"> а что нужно к этому URL добавить координаты той точки по которой пользователь щелкнул мышью .
В нашем примере если пользователь щелкнул по точке x=10 ,y=15 то браузер перейдет на URL:

http://www.somehost.ru/cgi-bin/somescript.cgi?10,15

Т.е. координаты идут на скрипте в переменную QUERY_STRING ,их оттуда извлечь? Нет ничего проще:

($x,$y)=split(/,/,$ENV{'QUERY_STRING'});

Вот скрипт,который просто показывает координаты точки щелчка:

#!/usr/bin/perl
#ismap_xy.cgi
($x,$y)=split(/,/,$ENV{'QUERY_STRING'});
print "Content-Type: text/htmlnn";
print "<HTML><HEAD><TITLE>Ismap X Y</TITLE></HEAD>";
print "<BODY><H1>Вы щелкнули в точке: x=$x ,y=$y</H1></BODY></HTML>";

А что с ними делать дальше это уже чисто зависит только от вашей фантазии.Дайте ей ход и все у вас получится!.Очень часто ismap применяют для графического оглавления сайта. Когда щелкают на разные части рисунка,то переходят к разным страничкам сайта. Это легко реализуется,если скрипт выдаст нужный URL в Location: (Вспомните заголовок ответа CGI).
Вот пример и покажет это.Заготовьте файл urlmap.txt в котором будет информация из строк в таком формате:

minx miny maxx maxy URL

где minx miny maxx maxy задают участок рисунка,а следующее за ними поле задает URL, которому этот участок соответствует.Пример:

1 1 20 50 http://www.uic.nnov.ru/~paaa/index_p.html
1 50 20 100 http://www.uic.nnov.ru/~paaa/projects.html
20 1 100 100 http://www.uic.nnov.ru/~paaa/cgi-bin/guestbook.cgi

Где нибудь на своей страничке воткните что-то вроде:

<A href="cgi-bin/testismap.cgi"><IMG src="gifs/doom2.jpg" border=0 ismap></A>

А сам скрипт testismap.cgi будет иметь вот такой простенький вид:

#!/usr/bin/perl
#testismap.cgi
$default_url="http://www.uic.nnov.ru/~paaa/";#URL по умолчанию,переходим к нему когда щелкнули
                                             #в участок,которому не сопоставлен URL
$url_map_file="urlmap.txt"; #файл с информацией об URL

($x,$y)=split(/,/,$ENV{'QUERY_STRING'});
open(F,"$url_map_file")|| print "Location: $default_urlnn";
$url=$default_url;
foreach(<F>){
 chomp;
 ($minx,$miny,$maxx,$maxy,$URL)=split(/s+/);
 if(($x>=$minx)&&($x<$maxx)&&
    ($y>=$miny)&&($x<$maxy)){$url=$URL;}
 }
close(F);
print "Location: $urlnn";

Разместил: Vulko
Опубликовано: 07.06.2004
Статья "CGI - Изображения ISMAP" прочтена 21110 раз.





Последние новости