Ohjeet -- Mappaus
Opas ImageMap Generaattorin käyttöön.
Tietämättömälle:
Mappaus (eli kuvakartta) tarkoittaa, että kuvan osasta/ osista tehdään linkkejä. Eli, kun klikkaat jotain kohtaa kuvassa pääset toiselle sivulle.
Mappaus on helppo keino saada hauskat ja omanlaiset linkit, mutta kannattaa aina miettiä, voisiko mappauksen korvata muulla tavalla, kuten leikkaamalla linkit irti toisistaan ja linkittämällä nämä kuvat.
Tämä toimii ainakin jos mapatuksi tarkoitetut linkit ovat vierekkäin taikka päällekkäin.
Kuvan linkittäminen (ei mappaus) tapahtuu koodilla <*a href="LINKIN OSOITE"><*img src="kuvan osoite" alt="kuvan nimi"> (poista tähdet *)
Mappaus
Mene osoitteeseen http://koti.mbnet.fi/winuus/imagene.php, joka on siis ImageMap Generaattori

Napsauta ensin punaisella ympyröityä "selaa..." painiketta ja hae tiedostostasi mapattava kuva.
Klikkaa sitten vihreällä ympyröityä "load" painiketta.

Valitse sinisellä merkitystä pudotus valikosta haluamasi muoto.
Polygon = kolmio
Retagle = neliö
Circle = ympyrä
Paina sitten oranssilla merkittyä nuolta.

Ensiksi valitsin neliön.
Neliön muotoista aluetta mapatessa, klikataan kahta neliön kulmaa. Kulmien täytyy olla ristikkäiset (merkitty kuvassa sinisillä ja vihreillä nuolilla). Valittu alue muuttuu siniseksi.
Tämän jälkeen klikataan vaaleanpunaisella ympyröityä kuviota.

Nyt valitsin edellä mainitusta pudotus valikosta kolmion, eli Polygon ja painan vieressä olevaa nuolta.
Kolmiota mapatessa klikataan kolmion kolema kulmaa. Kuvassa mapattava kolmio on merkitty vaalean punaisella.
Valittu alue muuttuu taas siniseksi, jonka jälkeen painan samaa kuviota kuin neliötä mapatessakin.

Nyt valitsen pudotusvalikosta ympyrän eli circle ja painan jälleen vieressä olevaa nuolta.
Ympyrässä merkitään ensin ympyrän keskikohta (oranssi piste).
Seuraavaksi klikkaat ympyrän "reunaa", mistä kohtaan tahansa (punainen piste).
Lopuksi painat taas samaa (vaaleanpunaisella ympyröityä) kuviota.

Kun olet mapannut kaikki haluamasi linkit, voit halutessasi laittaa jo linkkien osoitteet valmiiksi oranssilla ympyröityihin laatikoihin. Tämän voi kuitenkin ttehdä myös myöhemmin.
Paina sitten linkkiä HTML-KODE.

Eteesi tulevan koodin voit sitten laittaa siihen kohtaan mihin haluat mapatun kuvan.
Oranssilla merkittyihin kohtiin voit vaihtaa linkkien osoitteet, jos et sitä jo tehnyt edellisessä vaiheessa.
Sinisellä merkittyyn kohtaan vaihda kuvan osoite
Vihreällä merkittyyn kohtaan voit laittaa nollan tilalle jonkun numeron jos haluat kuvalle reunuksen. (esim. numeron 1)
|