Galeria + mapa bitowa Opcje

[crio]

Witam
Mam taki problem. Potrzebuje napisac skrypt ktory wykonuje nastepujace funkcje:
1. Wyswietla galerie.
2. Po wybraniu miniatury wyswietla ja jako duze foto
3. Na kazde duze foto nalozona jest mapa odsylaczy za pomoca ktorej odwoluje sie do konkretnych linkow
Galeryjke juz mam, ale nie wiem jak nalozyc odpowiednie mapy odsylaczy.
Prosze o pomoc w rozwiazaniu problemu
Na razie mam takie cos:

[HTML] pobierz, plaintext 
<script language="JavaScript" type="text/JavaScript">
var current_picture=0;
pictures = new Array(3);
pictures_big = new Array(3);
map_picture = new Array(3);
 
pictures[0]="Imale.jpg";
pictures[1]="IImale.jpg";
pictures[2]="IIImale.jpg";
 
pictures_big[0]="M1.jpg";
pictures_big[1]="M2.jpg";
pictures_big[2]="M3.jpg";
 
map_picture[0]="0";
map_picture[1]="1";
map_picture[2]="2";
 
function LoadMidPicture(picture_index)
{
current_picture=picture_index;
document.big_photo.src = pictures_big[picture_index];
return;
}
 
function LoadBigPicture(picture_index)
{
current_picture=picture_index;
return;
}
</script>
 
<table>
<tr><td width="100%" colspan=2><table cellpadding="4" cellspacing="4" width="100%"><tr><td class=darkn> Zdjęcia (kliknij zdjęcie, aby powiększyć)</td></tr><tr>
<td align="center">
<a href="javascript:LoadMidPicture(current_picture)" title="foto">
<img src="M1.jpg" alt="foto" name="big_photo" 
usemap="javascript:LoadMapPicture(current_picture)"
style="border: 1px solid #000000;" /></a>
 
<map name="0">
<area shape="poly" coords="39,39,127,38,127,236,40,235" href=http://www.costam.pl>
<area shape="poly" coords="211,39,211,232,128,233,126,40" href="#">
</map>
<map name="1">
<area shape="poly" coords="62,41,301,41,301,348,228,348,227,304,61,306" href="#">
<area shape="poly" coords="61,709,300,710,301,349,228,348,226,407,62,407" href="#">
</map>
<map name="2">
<area shape="poly" coords="57,26,295,25,296,333,224,333,223,291,56,290" href="#">
<area shape="poly" coords="297,695,58,694,57,392,223,391,223,333,296,334" href="#">
</map>
 
</a></td></tr>
 
<tr>
<td align="center"><table align="center" cellpadding="1" cellspacing="1">
<tr><td align="center" valign="middle">
<a href="javascript:LoadMidPicture(0);" title="foto" id="id0">
   <img src="Imale.jpg" alt="foto" width="200" height="230" style="border: 1px solid #000000;"></a>
</td>
 
<td align="center" valign="middle">
<a href="javascript:LoadMidPicture(1);" title="foto" id="id1">
   <img src="IImale.jpg" alt="foto" width="200" height="230" style="border: 1px solid #000000;"></a></td>
 
<td align="center" valign="middle">
<a href="javascript:LoadMidPicture(2);" title="foto" id="id2">
    <img src="IIImale.jpg" alt="foto" width="200" height="230" style="border: 1px solid #000000;"></a></td>
</tr><tr>
</tr>
 
<script language="JavaScript" type="text/JavaScript">
LoadBigPicture(0);
</script></table>
[HTML] pobierz, plaintext 

Powód edycji: dodałem bbcode (cysiaczek)