PDA

View Full Version : OnMouseOver image with links disappearing



Mardus
04-10-2008, 03:41 PM
Hi,

I am a beginner in this thing, so sorry if it's a stupid question, but I was unable to find the answer for my problem.

I created a mouseover image where the second image (ropes2.jpg) has links which should be accessible through imagemap. The problem is, when a cursor moves onto a link, the mouseover image (ropes2.jpg) goes back to mouseout image (ropes1.jpg). The imagemap is there, but the image disappears.

This is the current code:


<html>
<head>
<title>title</title>
<link href="style.css" type="text/css" rel="stylesheet">
<script language="javascript">
<!-- hide script from old browsers

//detect browser:
browserName = navigator.appName;
browserVer = parseInt(navigator.appVersion);
if (browserName == "Netscape" && browserVer >= 3) browserVer = "1";
else if (browserName == "Microsoft Internet Explorer" && browserVer == 4) browserVer = "1";
else browserVer = "2";

//preload images:
if (browserVer == 1) {
ropes1 = new Image(455,605);
ropes1.src = "ropes1.jpg";
ropes2 = new Image(455,605);
ropes2.src = "ropes2.jpg";
}

//image swapping function:
function hiLite(imgDocID, imgObjName, comment) {
if (browserVer == 1) {
document.images[imgDocID].src = eval(imgObjName + ".src");
window.status = comment; return true;
}}
//end hiding -->
</script>
</head>
<center>
<body>
<img name="ropes" src="ropes1.jpg" border=0 width=455 height=605 alt="" usemap="#ropesmap" onMouseOver="hiLite('ropes','ropes2','index')" onMouseOut="hiLite('ropes','ropes1','')">

<map name="ropesmap">
<area shape="poly" coords="115,136,252,121,273,124,271,142,175,151,117,154" href="link1">
<area shape="poly" coords="119,167,157,163,184,160,241,158,247,175,182,181,155,182,119,184" href="link2">
<area shape="poly" coords="122,196,196,192,198,210,159,214,126,212,127,207" href="link3">
</map>

</center>
</body>
</html>


Hope someone can help me solve this. Thank you in advance.

Nile
04-11-2008, 11:28 AM
Can we please see your page too?

Mardus
04-11-2008, 01:00 PM
Oh, yes, the page is here (http://needus.pri.ee/test.htm).

(Note: last three of the links are not mapped)
Thanks for your time...

Mardus
04-15-2008, 03:26 PM
Or maybe I should use something else instead the html/javascript/css? I was pretty sure the link problem could be solved with some javascript trick... Oh, currently I have no idea :confused: