Sams Teach Yourself HTML, CSS & JavaScript Web Publishing in One Hour a Day

(singke) #1
ptg16476052

What Is an Imagemap? 235

9


<area shape="rect" coords="259,113, 323,134"
href="/music/swing.html"
alt="Swing and Big Band Music">
<area shape="rect" coords="259,139, 323,159"
href="/music/jazz.html"
alt="Jazz and Free Style">
<area shape="rect" coords="259,163, 323,183"
href="/music/gospel.html"
alt="Gospel and Inspirational Music">
<area shape="circle" coords="379,152, 21"
href="/music/help.html"
alt="Help">



The tag that refers to the map coordinates uses usemap, as follows:



Finally, put the whole thing together and test it. Here’s a sample HTML file for The
Really Cool Music Page with a client-side imagemap, which contains both the tag
and the image that uses it:


Input ▼


<!DOCTYPE html>




The Really Cool Music Page



The Really Cool Music Page


Select the type of music you want to hear.

You'll go to a list of songs that you can select from.



Juke Box

href="/music/classics.html"
alt="Classical Music and Composers">
href="/music/country.html"
alt="Country and Folk Music">
href="/music/rockpop.html"
alt="Rock and Pop from 50's On">
href="code/music/home.html"
alt="Home Page for Music Section">


Free download pdf