View Full Version : Image Map Onmouseover Help


faded legacy
07-18-2003, 08:36 AM
I've been trying to make an image map that switches to a completely different picture when a person mouses over a hotspot. I did some searching around a found a code that I attempted to work with, but it's not functioning properly. I'll post the code bellow. Can you tell me what I did wrong? Well, thanks in advance for any help you can offer me.

<SCRIPT LANGUAGE="JavaScript"><!--
var js = 1.0;

Version = parseInt(navigator.appVersion);

if (navigator.appName == "Netscape")
js = ((Version >= 4) ? 1.2 : ( (Version == 3) ? 1.1 : 1.0 ));
else
if (navigator.appVersion.indexOf('MSIE') != -1)
js = ((Version >= 4) ? 1.1 : 1.0);

function changeImagemap(newImage) {
if (js > 1.0) document ['boxImage'].src = eval(newImage + ".src");
}

if (js > 1.0) {
pub = new Image();
pub.src = "www.boomspeed.com/broken_soul/pubnav.jpg";

aff = new Image();
aff.src = "www.boomspeed.com/broken_soul/runeringaff.jpg";

info = new Image();
info.src = "www.boomspeed.com/broken_soul/runeringinfo.jpg";

leave = new Image();
leave.src = "www.boomspeed.com/broken_soul/runeringleave.jpg";

apply = new Image();
apply.src = "www.boomspeed.com/broken_soul/runeringapply.jpg";

login = new Image();
login.src = "www.boomspeed.com/broken_soul/runeringlogin.jpg";

species = new Image();
species.src = "www.boomspeed.com/broken_soul/runeringspecies.jpg";

rules = new Image();
rules.src = "www.boomspeed.com/broken_soul/runeringrules.jpg";

plot = new Image();
plot.src = "www.boomspeed.com/broken_soul/runeringplot.jpg";
}

//-->
</SCRIPT>



<img src="http://www.boomspeed.com/broken_soul/pubnav.jpg" usemap="#pubnav" border="0"><map name="pubnav">
<area shape="rect" coords="30,67,41,95" href="login.html" title="" target="inl"
onMouseOver="changeImagemap('login');self.status='Red Square';return true"
onMouseOut="changeImagemap('pubnav');self.status='';return true">
<area shape="rect" coords="42,69,50,98" href="http://www.avidgamers.com" title="" target="inl"
onMouseOver="changeImagemap('leave');self.status='Red Square';return true"
onMouseOut="changeImagemap('pubnav');self.status='';return true">
<area shape="rect" coords="49,70,71,105" href="plot.html" title="" target="inl"
onMouseOver="changeImagemap('plot');self.status='Red Square';return true"
onMouseOut="changeImagemap('pubnav');self.status='';return true">
<area shape="rect" coords="72,75,98,104" href="info.html" title="" target="inl"
onMouseOver="changeImagemap('info');self.status='Red Square';return true"
onMouseOut="changeImagemap('pubnav');self.status='';return true">
<area shape="rect" coords="102,75,118,103" href="rules.html" title="" target="inl"
onMouseOver="changeImagemap('rules');self.status='Red Square';return true"
onMouseOut="changeImagemap('pubnav');self.status='';return true">
<area shape="rect" coords="120,73,139,102" href="species.html" title="" target="inl"
onMouseOver="changeImagemap('species');self.status='Red Square';return true"
onMouseOut="changeImagemap('pubnav');self.status='';return true">
<area shape="rect" coords="140,67,151,97" href="links.html" title="" target="inl"
onMouseOver="changeImagemap('aff');self.status='Red Square';return true"
onMouseOut="changeImagemap('pubnav');self.status='';return true">
<area shape="rect" coords="154,62,164,95" href="apply.php" title="" target="inl"
onMouseOver="changeImagemap('apply');self.status='Red Square';return true"
onMouseOut="changeImagemap('pubnav');self.status='';return true">
<area shape="default" nohref>
</map>

angelivion
07-21-2003, 09:39 AM
Originally posted by faded legacy
pub = new Image();
pub.src = "www.boomspeed.com/broken_soul/pubnav.jpg";

aff = new Image();
aff.src = "www.boomspeed.com/broken_soul/runeringaff.jpg";

info = new Image();
info.src = "www.boomspeed.com/broken_soul/runeringinfo.jpg";

leave = new Image();
leave.src = "www.boomspeed.com/broken_soul/runeringleave.jpg";

apply = new Image();
apply.src = "www.boomspeed.com/broken_soul/runeringapply.jpg";

login = new Image();
login.src = "www.boomspeed.com/broken_soul/runeringlogin.jpg";

species = new Image();
species.src = "www.boomspeed.com/broken_soul/runeringspecies.jpg";

rules = new Image();
rules.src = "www.boomspeed.com/broken_soul/runeringrules.jpg";

plot = new Image();
plot.src = "www.boomspeed.com/broken_soul/runeringplot.jpg";
}



i didn't really check the whole code... but don't you think it should be "http://www.blablabala" ?