PDA

Click to See Complete Forum and Search --> : how do i do multiple mouseovers

trialpete
12-11-2003, 12:41 AM
i am having troubles doing multiple mouseovers. i might actually be using the wrong script...? i need help. need help...please...! i the parts in bold is where the problem is:

<html>
<head>
<title>
i luv *eMo*
</title>

<script language="Javascript1.2">

am = "sorry, can't copy me, hehehe";

bV = parseInt(navigator.appVersion)
bNS = navigator.appName=="Netscape"
bIE = navigator.appName=="Microsoft Internet Explorer"

function nrc(e) {
if (bNS && e.which > 1){
alert(am)
return false
} else if (bIE && (event.button >1)) {
alert(am)
return false;
}
}

document.onmousedown = nrc;
if (document.layers) window.captureEvents(Event.MOUSEDOWN);
if (bNS && bV<5) window.onmousedown = nrc;

</script>

<script language="JavaScript">
var n3 = false;
image0 = new Image();
image0.src = "menu-button-full-time.jpg";
image0on = new Image();
image0on.src = "home-button-on.jpg"

image1 = new Image();
image1.src = "menu-button-full-time.jpg";
image1on = new Image();
image1on.src = "about-button-on.jpg"

image2 = new Image();
image2.src = "menu-button-full-time.jpg";
image2on = new Image();
image2on.src = "pictures-button-on.jpg"

image3 = new Image();
image3.src = "menu-button-full-time.jpg";
image3on = new Image();
image3on.src = "poems-button-on.jpg"

image4 = new Image();
image4.src = "menu-button-full-time.jpg";
image4on = new Image();
image4on.src = "links-button-on.jpg"

image5 = new Image();
image5.src = "menu-button-full-time.jpg";
image5on = new Image();
image5on.src = "email-button-on.jpg"
function on3(name)
{
document[name].src = eval(name + "on.src");
}

function off3(name)
{
document[name].src = eval(name + ".src");
}

n3 = true;
function on(name)
{
if (n3)
on3(name);
}

function off(name)
{
if (n3)
off3(name);
}
</script>

</head>
<body bgcolor="black">
<img src="menu-button-full-time.jpg" name="image0" align="right" border="0" usemap="#menu-button-full-time" style="border-style:none" />
<map id="menu-button-full-time" name="menu-button-full-time">
<area shape="circle" coords="242,147,30" href="home.html" target="display" onmouseover="on('image0')" onmouseout="off('image0');" />
<area shape="circle" coords="202,193,30" href="about.html" target="display" onmouseover="on('image1');" onmouseout="off('image1')" />
<area shape="circle" coords="162,237,30" href="pictures.html" target="display" onmouseover="on('image2');" onmouseout="off('image2')" />
<area shape="circle" coords="123,283,30" href="poems.html" target="display" onmouseover="on('image3');" onmouseout="off('image3')" />
<area shape="circle" coords="163,328,29" href="links.html" target="display" onmouseover="on('image4');" onmouseout="off('image4')" />
<area shape="circle" coords="202,372,29" href="email.html" target="display" onmouseover="on('image5');" onmouseout="off('image5')" />
<area shape="rect" coords="265,542,406,554" href="index.html" target="_parent ">
<area shape="default" nohref="nohref" />
</map>
</body>
</html>
Pittimann
12-11-2003, 01:28 AM
Hi!

The main point is: the name of the image to be exchanged is "image0", so you always have to substitute "image0.src" and nothing else. So it is also not necessary, to have "image1", "image1.src" etc - you just need image0 once and the "on" images.

Here's some code:
<html>
<head>
<title>
i luv *eMo*
</title>
<script language="Javascript1.2">
am = "sorry, can't copy me, hehehe";
bV = parseInt(navigator.appVersion)
bNS = navigator.appName=="Netscape"
bIE = navigator.appName=="Microsoft Internet Explorer"
function nrc(e) {
if (bNS && e.which > 1){
alert(am)
return false
} else if (bIE && (event.button >1)) {
alert(am)
return false;
}
}
document.onmousedown = nrc;
if (document.layers) window.captureEvents(Event.MOUSEDOWN);
if (bNS && bV<5) window.onmousedown = nrc;
</script>
<script language="JavaScript">
var n3 = false;
image0 = new Image();
image0.src = "menu-button-full-time.jpg";
image0on = new Image();
image0on.src = "home-button-on.jpg"
image1on = new Image();
image1on.src = "about-button-on.jpg"
image2on = new Image();
image2on.src = "pictures-button-on.jpg"
image3on = new Image();
image3on.src = "poems-button-on.jpg"
image4on = new Image();
image4on.src = "links-button-on.jpg"
image5on = new Image();
image5on.src = "email-button-on.jpg"
function on(imageName) {
document.image0.src = imageName + "on.src";
}
function off(imageName)
{
document.image0.src = image0.src;
}
</script>
</head>
<body bgcolor="black">
<img src="popup.gif" name="image0" align="right" border="0" usemap="#menu-button-full-time" style="border-style:none" />
<map id="menu-button-full-time" name="menu-button-full-time">
<area shape="circle" coords="242,147,30" href="home.html" target="display" onmouseover="on('image0')" onmouseout="off('image0');" />
<area shape="circle" coords="202,193,30" href="about.html" target="display" onmouseover="on('image1');" onmouseout="off('image1')" />
<area shape="circle" coords="162,237,30" href="pictures.html" target="display" onmouseover="on('image2');" onmouseout="off('image2')" />
<area shape="circle" coords="123,283,30" href="poems.html" target="display" onmouseover="on('image3');" onmouseout="off('image3')" />
<area shape="circle" coords="163,328,29" href="links.html" target="display" onmouseover="on('image4');" onmouseout="off('image4')" />
<area shape="circle" coords="202,372,29" href="email.html" target="display" onmouseover="on('image5');" onmouseout="off('image5')" />
<area shape="rect" coords="265,542,406,554" href="index.html" target="_parent ">
<area shape="default" nohref="nohref" />
</map>
</body>
</html>

Cheers - Pit
little jim
12-11-2003, 01:30 AM
Your problem seems strange, for one thing, your script is very inifecent, and i don't see how your problems has anything to do with onmouseovers? If you mean can you have more than one thing happen on the on onmouseover, yes, you just have to eneter the code as normal, if you mean to have the onmouseover do something different after an event, you have to do this in your script, you can't change the onmouseover in the Javascript.