Keskustelu: Nettisivujen teko: imagemaps ongelma

Hei,

Ongelmani koskee imagemapsien tekemistä. Tarkoitukseni olisi saada toimimaan seuraavanlainen kokonaisuus. Kuvia on reilu kymmenen ja jokaiseen on tarkoitus saada oma imagemap siten, että kaikki pyörisi samassa html tiedostossa ja vain yksi kuva näkyisi kerrallaan.

Tällä hetkellä olen saanut toimimaan siten, että jokaiselle kuvalle tekee oman html-tiedoston tai sitten kaikki kuvat tulee näkyviin yhtä aikaan. Tätä olen kehitellyt javascriptillä ja yrittänyt googlettaa. Tuloksena on vain yhden kuvan imagemap ohjeita, joten kysynkin onko kuvien käyttämää imagemap määrityksiä mahdollista vaihtaa ja jos on niin miten

Tässä pätkä koodista mitä yritän. Siis tuossa kuvat vaihtuu oikein samaan kohtaa niin, että uusi korvaa vanhan, mutta imagemapsit ei sitten toimi. Jos jollain olisi tietoa asiasta.

<script language="javascript1.2">
<!--
var kuva1 = new Image();
var kuva2 = new Image();

kuva1.src="kuva1.gif";
kuva2.src="kuva2.gif";

kuva1.usemap="kuva1";
kuva2.usemap="kuva2";
//-->
</script>



<select>
<option onClick="valitsekuva(0)">Valitse</option>
<option onClick="valitsekuva(1)">Kuva1</option>
<option onClick="valitsekuva(2)">Kuva2</option>
</select>


<script type="text/javascript">
function valitsekuva(nro)
{
   switch(nro)
   {
      case 0:
         break;
      case 1:
         document.images['kuva'].src = kuva1.src;
         document.images['kuva'].usemap = kuva1.usemap;
         break;
      case 2:
          document.images['kuva'].src = kuva2.src;
          document.images['kuva'].usemap = kuva2.usemap;
          break;
      default:
   }
}
</script>

<img name="kuva" width ="600" height ="600" alt=""/>

<map name="kuva1">
   <area shape ="circle" coords ="250,500,100" href ="#"  alt="1" />
   <area shape ="circle" coords ="200,170,100" href ="#" alt="2" />
</map>

<map name="kuva2">
   <area shape ="circle" coords ="150,200,50" href ="#"  alt="1" />
   <area shape ="circle" coords ="100,270,50" href ="#" alt="2" />
</map>

Kiitos jo etukäteen.

Mod. lisäsi kooditagit

Voisitko kertoa ihan mitä olet yrittämässä. Itse en selostuksen perusteella käsittänyt, miksi juuri imagemappia pitää tässä käyttää. Miksei esim. koko kuva voi toimia linkkinä?

Joo siis kuvat ovat eräänlaisia karttoja ja jokaisessa kuvassa/kartassa on 1-3 eri kohtaa josta klikkaamalla halutaan suurennettu kuva ko. kohdasta. Nämä suurennetut kuvat/kartat olisi tarkoitus avautua samaan kohtaa alkuperäisen kuvan/kartan kanssa. Tietenkin ilman alkuperaisen kuvan imagemapsia.

Asiaa mitenkään tutkimatta tai tuntematta sanoisin, että kirjoita useMap äläkä usemap. Kirjainkoolla on merkitystä.

Joo no olipas pienestä kiinni. Joissakin esimerkeissä tosin se oli kirjoitettu kokonaan pienellä (tarkistin vielä :)), niin ei heti tullut mieleen tuo.

Nyt homma kuitenkin luistaa ja kiitoksia vielä Metabolixille.

Nyt ilmeni sitten toinen mysteeri. Tein sivuston Firefoxilla testaillen ja loppuvaiheessa aloin testaamaan sitten muilla selaimilla, niin huomasin ettei sivut toimikkaan IE:llä.

Ongelmaksi muodostuu se, että document.images :lla ladattavat kuvat eivät ilmesty näkyviin. Kuvan kehykset/paikka näkyy, mutta itse kuva ei. Mahtaakohan document.images kohdassa olla jotain vai mikähän tuossa mahtaa olla sellaista mitä IE ei pysty tulkitsemaan.