Titel: Imagemapping Med Adobe Imageready
Sværhedsgrad: Begynder
Skrevet af: Muuus
Skrevet den: 26/02-2009 22:28:15
Krav: Adobe Photoshop + Adobe Imageready
Læst: 225 gange

Eksempel:


Start med at lave det billede du vil lave en imagemapping på..

Klik på knappen der ser således ud:
Du finder den i bunden af din toolbar..

Nu åbnes billedet i Imageready istedet, og det er det program vi skal bruge til at lave imagemapping med..

Klik på denne knap
Marker nu det stykke på billedet du vil lave til et link

Når du har gjort det skal vi jo også fortælle den hvad der skal linkes til, dette gøres i
det vindue der hedder Image Map
Er vinduet ikke åben skal du først åbne det Window -> Image Map

Nu skal du skrive der hvor der står URL

Jeg har valgt at min skal linke til index.php, da jeg har lavet et "Enter skilt"

Nu er vi faktisk næsten færdige, vi skal bare lige have HTML koden..

Klik på Edit -> Copy HTML code -> For All Slices

Åben notesblok og tryk Ctrl + V
Og så vil HTML koden du skal bruge komme frem, den vil se ud lidt alá denne:

<img src="enterskilt.png" width="200" height="200" border="0" alt="" usemap="#Enter"> <map name="Enter"> <area shape="rect" alt="" coords="57,141,194,192" href="index.php"> </map>

Forklaring på koden:
src="enterskilt.png" - Url'en til billedet
usemap="#Enter" - Navnet på den map vi har lavet du kan kalde den hvad du vil bare du husker #
map name="Enter" - Skal have samme navn som usemap bare uden # ellers virker det ikke