Skip to main content

How to mapping an image in HTML

How to mapping image

How to mapping an image

mapping an image with amazingly HTML
للغة العربية اضغط هنا


Hover on items inside the image to see the magick




Today we going to learn how to mapping an image it is very easy tutorial have fun :)
first tool
1-usemap
2-map name
3-area tag
Amd u need to find some coords

this is the tag
dont worry its ok i am going to explain the code
First inserting the image u want

ok Now we just want to make a small change on our source
Add this words to your img source usemap=""
relax it is very simple

Now give the name for your little map and don't forget to type(#) before the name

right we named our map Now we need to create the map

we just put this tag to create your map and in the end, put the name u have typed in this time we not need (#) Tag
the last tag will be the area tag

inside area tag, we can put the coords ,title, and links

And this is all :)
by the way you can get coords from a lot of programs and websites
i am going to give you the best website that give you a good coords
Click here to visit the weebsite
1- choose the image you want to mapping 2- uploading the image finally click on the accept

select the image and copy the coords

select the another image and get the coords
Now just go to the area code and past the coords u have got

Now if you want give it name to image when u hover on image just add title into area tag

do the same thing with another image

the final form for tag

result
Hover om image to see the final result


Warning : u can use href tag to make the image clickable :)
thx so much and waiting for me for Next Tutorials

How to make slideshow