rollover image from multiple image map hotspots

  • Hi ??

    I researched on various topics but found nothing very well explained . I’m trying to insert a rollover image from multiple hotspots into a WordPress page but I can not.

    The code is this:

    <html xmlns="https://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<script type="text/javascript">
function MM_preloadImages() { //v3.0
  var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array();
    var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++)
    if (a[i].indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}}
}

function MM_swapImgRestore() { //v3.0
  var i,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a[i])&&x.oSrc;i++) x.src=x.oSrc;
}

function MM_findObj(n, d) { //v4.01
  var p,i,x;  if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) {
    d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}
  if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n];
  for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document);
  if(!x && d.getElementById) x=d.getElementById(n); return x;
}

function MM_swapImage() { //v3.0
  var i,j=0,x,a=MM_swapImage.arguments; document.MM_sr=new Array; for(i=0;i<(a.length-2);i+=3)
   if ((x=MM_findObj(a[i]))!=null){document.MM_sr[j++]=x; if(!x.oSrc) x.oSrc=x.src; x.src=a[i+2];}
}
</script>
</head>

<body onload="MM_preloadImages('pb1.png','al1.png')">
<img src="pe1.png" alt="Pernambuco" width="396" height="428" border="0" usemap="#Map" id="Image1" />
<map name="Map" id="Map">
  <area shape="poly" coords="324,141,323,152,316,152,310,155,301,153,295,153,288,149,279,153,273,148,276,141,279,138,290,141,297,143,300,140,304,138,305,145" href="http:/google.com" target="_top" />
  <area shape="poly" coords="305,126,305,133,311,134,314,131,321,132,322,137,316,141,310,141,306,138,299,138,294,139,293,134,295,131" href="https://google.com" target="_top" onmouseover="MM_swapImage('Image1','','pb1.png',1)" onmouseout="MM_swapImgRestore()" />
  <area shape="poly" coords="299,155,306,160,310,163,318,156,314,154" href="#" onmouseover="MM_swapImage('Image1','','al1.png',1)" onmouseout="MM_swapImgRestore()" />
</map>
</body>
</html>

    I did it with Dreamweaver, and I tryied to put the javascript into the header page and the content from the tag <body onload…> </body> in a page but it doesn’t work. I’m not sure if the problem is with the tag body or in the wordpress this kind of rollover image is not able to work.

    Could someone help me?

    thxx alot!

Viewing 2 replies - 1 through 2 (of 2 total)
Viewing 2 replies - 1 through 2 (of 2 total)
  • The topic ‘rollover image from multiple image map hotspots’ is closed to new replies.