Julkiset tietoverkot

Sorakuilu

Harjoitus 6, kuvakartta

Kuvakartta on kuva, johon on upotettu useita eri linkkejä.

Aluksi kuva avataan PhotoShopissa ja mitataan linkkien paikka (pikseleinä, x- ja y-koordinaatit).

Kartta sijoitetaan map-elementtiin, jonka sisällä on area-elementtejä.

map-elementin pakollinen ominaisuus on name, myös id on mahdollinen (oltava sama kuin name)

area-elementillä on mm. seuraavia ominaisuuksia:

Esimerkki

Tallenna seuraava kuva omaan kuvat-kansioosi nimellä logo.gif.

logo

Avaa kuva PhotoShopissa. Avaa info-paletti (Window - Info), vaihda yksikkö pikseleiksi ja tutki sekä kirjaa ylös seuraavat koordinaatit:

kuvakartta

Tee kuvakartta valmiiksi - j:n piste vie Leenan kotisivulle (http://www.leeniemi.net), keltainen ikkuna w3schools-sivustolle /http://www.w3schools.com ja puolikaari Tredun kotisisvulle (http://www.tredu.fi).

Apua tekemiseen löydät w3schoolsin sivuilta.

Tallenna työ palautuskansion alikansioon harj nimellä harj6.html.