PDA

View Full Version : onmouseover= inside div does not work?


BrackAttack
06-09-2009, 04:41 PM
Hello. I am building a lower nav menu. When i preview this code, the mouse over event does not work, there is no change in image.


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>test</title>
<style type="text/css">
/*<![CDATA[*/

* {margin:0; padding:0;}
body {
background:#494E48;
text-align: center;
}
p {
}
#wrapper {
width:945px;
margin:0 auto;
border-right:5px solid;
background-color: #093;

}
#head {
width:100%;
height:365px;
background:#fff;
background-image: url(images/header2b_02.jpg);
text-align: center;

}
#content {
margin: 0 auto;
display:inline
}

#footer {
clear:both;
width:100%;
height:74px;
background-repeat: no-repeat;
background-image: url(images/footernew2_53.jpg);
}


#lowermenudiv {
font-family: Verdana, Geneva, sans-serif;
text-align: center;
padding-top: 30px;
margin: 0 auto;


}
</style>
<script type="text/javascript">
<!--
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_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_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('images/GilaTest2_36b.gif')">
<div id="wrapper">
<div id="content">
<div id="ContentBox1up"></div>
<div id="ContentBox2down"></div>
</div>

<div id="footer">
<div id="lowermenudiv"><a href="#" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image1','','http://images.bestbuy.com/BestBuy_US/en_US/images/global/header/logo.gif',1)"><img src="http://g-ecx.images-amazon.com/images/G/16/nav/jan08_global_nav/bullseye._V2546705_.gif" name="Image1" width="43" height="11" border="0" id="Image1" /></a><a href="#" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image1','','http://www.petco.com/assets/header/logo_petco.gif',1)"><img src="http://pet.imageg.net/images/logo.png" name="Image1" width="71" height="11" border="0" id="Image1" /></a></div>
</div>
</div>

</body>
</html>

DWcourse
06-09-2009, 05:49 PM
Are you sure they're not working? Since you're loading the images from another site and you didn't preload them, the rollovers may just be taking a while to download (especially when you preview on your local computer).

BrackAttack
06-09-2009, 07:55 PM
Good idea, but that does not seem to be the issue. I did add the image links into the code so that there would be some images for you to see, but both my actual local menu images, and the linked images, do not rollover in preview - even with ample load time. I also published the page here on my server to test and it did not work there either.

http://www.normallythisweird.com/ntw_html_pages/Untitled-2.html

DWcourse
06-09-2009, 08:57 PM
Both your images have the same name and id (Image1) change the name of one of them.

BrackAttack
06-09-2009, 09:57 PM
Thank you.