Interaktiiviset kuvat

Harjoituksia

Takaisin

Interaktiivinen sivu sisältää "kuumia kohtia". Klikatessasi hiirellä ko. kohdan päällä, saat näytöllesi uuden www-sivun samalla tavoin kuin esimerkiksi tekstilinkeissä.

Interaktiivisilla kuvilla tarkoitetaan tilannetta, jossa esimerkiksi seuraavanlaista tilannetta:

Esimerkki
Kokeile esimerkiksi Nalle Puhia, Ihaata tai Nasua.

Tee vastaavavanlainen sivusto:

1. Kuvan (jpg/gif) sisältävä sivu. Kuvassa vähintään kaksi erillistä elementtiä, joita voidaan klikata.

2. Kaksi sivua (.htm), joihin edellä mainitusta kuvan tietyistä kohdista siirrytään, sivut voivat olla myös valmiita jo netissä olevia sivuja.

3. Käynnistä apuohjelmaksi Paint Shop Pro, jonka avulla voit selvittää "eri kohtien koordinaatit".

4. Lisää seuraavankaltainen koodi sille sivulle, jossa klikattava kuva sijaitsee.

 

<MAP NAME="kartta">
<AREA SHAPE="RECT" COORDS="x,y,x,y" HREF="sivu2.htm">
<AREA SHAPE="CIRCLE" COORDS="x,y,z" HREF="sivu3.htm">
</MAP>

Kuvan jakoon ilmoitetaan seuraavalla koodilla:

<IMG SRC="kuvakartta.gif" USEMAP="#kartta" BORDER=0>

x on vaakasuoraan ja y pystysuoraan.
Nelikulmiot RECT määritellään ilmoittamalla niiden vasemman ylänurkan ja oikean alanurkan koordinaatit.
Ympyröistä CIRCLE ilmoitetaan keskipiste ja säde.
Monikulmiot POLY puolestaan määritellään luettelemalla kaikki kulmat.

 

On myös olemassa ohjelmia, joilla voi tehdä vastaavat kohdat.