Map Area (Append)

<body>
<script src= "Http://code.jquery.com/jquery-1.11.0.min.js" ></script>
<!--<script src= "Http://code.jquery.com/jquery-migrate-1.2.1.min.js" ></script>-->
<script >
$ (function () {
$ ("Map area"). Hover (function () {
$ ("#content"). Empty (). Append (This.alt). Show ();

},function () {
$ ("#content"). Hide ();
})
})
</script>
Src= "Eg_planets.jpg"
Border= "0" usemap= "#planetmap"
alt= "Planets"/>

<map name= "Planetmap" id= "Planetmap" >

<area
Shape= "Circle"
Coords= "180,139,14"
href = "/example/html/venus.html"
target = "_blank"
alt= "Venus"/>

<area
Shape= "Circle"
Coords= "129,161,10"
href = "/example/html/mercur.html"
target = "_blank"
alt= "Mercury"/>

<area
Shape= "Rect"
Coords= "0,0,110,260"
href = "/example/html/sun.html"
target = "_blank"
alt= "Sun"/>

</map>

<div id= "Content" style= "position:absolute;top:50%;left:50%;d isplay:none;width:200px;height:20px; background-color:red; " >

</div>
</body>

Map Area (Append)