JavaScript Help!!!!

Здравей те,
имам нужда от помощ - имам една картинка , определил съм по нея image-map и искам като минавам с мишката по различните area-и да показвам различни DIV. Опитвах разни неща, обаче не се получава
Моля помогнете !!!!
<html>
<head>
<style>
div#pyramide area span {display: none;}
div#pyramide area:hover span {
display: block;
position: absolute; top: 180px; left: 0; width: 125px;
padding: 5px; margin: 10px; z-index: 100;
color: #AAA; background: black;
font: 10px Verdana, sans-serif; text-align: center;
}
#probe {display: none;}
</style>
<SCRIPT TYPE="TEXT/JAVASCRIPT" LANGUAGE=JAVASCRIPT>
<!--
function overMenu(currMenu){
if(document.all){
this.Menu = eval("document.all" + currMenu + ".style" )

if (this.Menu.display == "block") { this.Menu = "none" }

} else { return true }
}
function outMenu(currMenu){
if(document.all){
this.Menu = eval( "document.all" + currMenu + ".style" )

if (this.Menu.display == "none") { this.Menu = "block" }

} else { return true }
}
-->

</SCRIPT>
</head>
<body>
<div id="pyramide">
<img src="pyramide.jpg" width="458" height="358" usemap="#Map" border="0">
<map name="Map">
<area shape="poly" coords="23,297,118,267,227,255,332,266,433,295,451,345,348,319,230,306,129,314,52,334,6,350" href="javascript:;" alt="Hotspot1" onMouseOver="return overMenu('probe');" onMouseOut="return outMenu('probe');">
<area shape="poly" coords="42,245,128,220,222,212,312,218,415,245,429,289,330,263,223,253,132,261,27,291" href="#">
<area shape="poly" coords="60,196,128,177,221,167,309,174,396,195,412,239,317,215,219,207,142,214,46,239" href="#">
<area shape="poly" coords="79,145,156,128,219,123,295,127,377,144,393,188,307,170,222,164,148,170,64,189" href="#">
<area shape="poly" coords="96,97,154,85,222,79,288,83,359,96,375,139,302,124,219,120,145,125,83,140" href="#">
<area shape="poly" coords="115,46,171,36,225,32,288,35,341,42,357,88,289,78,223,75,157,79,98,90" href="#">
</map>

<span id="probe">hallo</span>
</div>

</body>
</html>

Оправих се - даже без JavaScript, а само с CSS