In this post i will told you how to perform practical of Hyperlinks on web page using Client Side Image Mapping
1. Go to notepad and type the following html code or you can copy from here.
<html>
<head>
<title>Image Map</title></head>
<body><center><h1>Client Side Image Mapping</h1><br>
<img src="flower.jpg"usemap="#sample">
<map name="sample">
<area shape="rect"coords="112,217,206,290"href="http://www.yahoo.com"alt=yahoo>
<area shape="circle"coords="461,392,50" href="http://examinfo.mh-hsc.ac.in"alt=Board>
<area shape="polygon"coords="175,190,200,160,180" href="http://www.google.com"alt=Google>
</map></center>
</body></html>
Note That: The jpg file name is used must present in your your folder where you saving this file. or give file path your image where it is placed.
1. Go to notepad and type the following html code or you can copy from here.
<html>
<head>
<title>Image Map</title></head>
<body><center><h1>Client Side Image Mapping</h1><br>
<img src="flower.jpg"usemap="#sample">
<map name="sample">
<area shape="rect"coords="112,217,206,290"href="http://www.yahoo.com"alt=yahoo>
<area shape="circle"coords="461,392,50" href="http://examinfo.mh-hsc.ac.in"alt=Board>
<area shape="polygon"coords="175,190,200,160,180" href="http://www.google.com"alt=Google>
</map></center>
</body></html>
2. After typing this page save the file using .htm or .html extension.
3. After saving this file open the file in internet explorer or fire fox or google chrome browser.
4. You will obtain following output:
Note That: The jpg file name is used must present in your your folder where you saving this file. or give file path your image where it is placed.
Thank You for reading this blog.
Post a Comment