Newbie help: mouseover on image sometimes returning wrong image from image map

Question

Have www.website.com/sds/ (index.htm) set up so that a mouseover on various places shows an image.
For some reason image 2.jpg and 3.jpg (move mouse back and forth on blue balloon) are both showing up (not at same time) when you mouse over the blue balloon. Only 3.jpg (child in chair) should show up on the blue balloon.

2.jpg (found on pink balloon) works fine on pink balloon.
I changed the map from "poly" to "rect" with new coords for images 2 and 3 thinking that may help but it did not. 2.jpg comes up fine on pink balloon.

Any help appreciated, PC

Answer 1

I've re-made the areas for your balloons, you had quite a mess of coords right there. Just replace the n.jpg with the file name for that balloon's number on the reference image.

Update: Changed the polygons to circles since they're showing some inconsistencies. Hope this time it works. And we can close this question too.

And those are the codes for each of them:

<area shape="circle" coords="231,49,46" href="" onmouseover="changeImage('1.jpg')" onmouseout="resetImage()"/> 

<area shape="circle" coords="273,112,31" href="" onmouseover="changeImage('2.jpg')" onmouseout="resetImage()"/> 

<area shape="circle" coords="169,150,33" href="" onmouseover="changeImage('3.jpg')" onmouseout="resetImage()"/> 

<area shape="circle" coords="97,159,32" href="" onmouseover="changeImage('4.jpg')" onmouseout="resetImage()"/> 

<area shape="circle" coords="134,59,38" href="" onmouseover="changeImage('5.jpg')" onmouseout="resetImage()"/>

<area shape="circle" coords="67,87,28" href="" onmouseover="changeImage('6.jpg')" onmouseout="resetImage()"/>