javascript konflikter efter PNG fix?
hej, jeg har et mouseover javascript som jeg ville have til at virke med png billeder i IE5.5 og 6.. men efter jeg har importeret png fixet, virker min mouseover effekt ikke.. den melder fejl :-/nogen der kan sige hvorfor?
kode:
<!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">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Kindtand.dk</title>
<link href="style/css.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="js/default.js"></script>
<!--[if lt IE 7]>
<script language="JavaScript">
function correctPNG() // correctly handle PNG transparency in Win IE 5.5 & 6.
{
var arVersion = navigator.appVersion.split("MSIE")
var version = parseFloat(arVersion[1])
if ((version >= 5.5) && (document.body.filters))
{
for(var i=0; i<document.images.length; i++)
{
var img = document.images[i]
var imgName = img.src.toUpperCase()
if (imgName.substring(imgName.length-3, imgName.length) == "PNG")
{
var imgID = (img.id) ? "id='" + img.id + "' " : ""
var imgClass = (img.className) ? "class='" + img.className + "' " : ""
var imgTitle = (img.title) ? "title='" + img.title + "' " : "title='" + img.alt + "' "
var imgStyle = "display:inline-block;" + img.style.cssText
if (img.align == "left") imgStyle = "float:left;" + imgStyle
if (img.align == "right") imgStyle = "float:right;" + imgStyle
if (img.parentElement.href) imgStyle = "cursor:hand;" + imgStyle
var strNewHTML = "<span " + imgID + imgClass + imgTitle
+ " style=\"" + "width:" + img.width + "px; height:" + img.height + "px;" + imgStyle + ";"
+ "filter:progid:DXImageTransform.Microsoft.AlphaImageLoader"
+ "(src=\'" + img.src + "\', sizingMethod='scale');\"></span>"
img.outerHTML = strNewHTML
i = i-1
}
}
}
}
window.attachEvent("onload", correctPNG);
</script>
<![endif]-->
<script type="text/javascript">
function m3over() {
document.m3.src ="gfx/menu/3over.png";
}
function m3out() {
document.m3.src ="gfx/menu/3.png";
}
</script>
<style type="text/css">
.m1 {
width:100%;
background-color:#BFBFBF;
}
</style>
</head>
<body>
<!--Content-->
<div id="maincontainer">
<!--Top section-->
<div id="topsection">1</div>
<!--/Top section/-->
<!--Body-->
<div id="body">
<!--Left-->
<div id="left">
<div id="blackbox">2</div>
<div id="nav">3</div>
<div id="nav2">4<br />
<!--<img id="expi" style="cursor:pointer;" src="gfx/menu/ar1.gif" name="exp" alt="Minimer / Maksimer" title="Minimer / Maksimer" onclick="expcol('exp');" />-->
<p id="expi" onclick="expcol('exp')" style="cursor:pointer;">hej</p>
<div id="expc" class="m1"><a href="#">Nyhed1</a><a href="#">Nyhed2</a><a href="#">Nyhed3</a></div>
</div>
</div>
<!--/Left/-->
<!--Mid-->
<div id="mid">
<div id="toppic">5</div>
<!--Content-->
<div id="content">6<br />
<div id="menucontainer">
<img id="m1" class="m" src="gfx/menu/1.png" />
<img id="m2" class="m" src="gfx/menu/2.png" />
<a href="#" onmouseover="m3over();" onmouseout="m3out();"><img id="m3" name="m3" class="m" src="gfx/menu/3.png" /></a>
<img id="m4" class="m" src="gfx/menu/4.png" />
</div>
</div>
</div>
<!--/Content/-->
</div>
<!--/Mid/-->
<div id="bottom">
<!--Footer-->
<div id="footer">7</div>
<div id="info"> <a href="http://jigsaw.w3.org/css-validator/" target="_blank">CSS 3.0</a><a href="http://validator.w3.org/check?uri=referer" target="_blank">xhtml</a><a href="http://www.rs-invent.dk" target="_blank"><font color="#FF3300">Credits</font></a></div>
<!--/Footer/-->
</div>
<!--/Bottom/-->
</div>
<!--/Body/-->
</div>
<!--/Content/-->
</body>
</html>
