Teorien jeg lige hurtigt afprøvede var at IE lagde filter billedet ovenpå selve div'en så man ikke kunne få onmouseover på underliggende elementer aktiveret ... det har ikke noget med scriptet at gøre - men åbenbart noget med IE's png loader (tyder det på) prøv denne test:
css:
#content,#content2
{
position: absolute;
width: 850px;
height: 567px;
left: 50%;
margin-left: -425px;
z-index: 10;
}
#content2{z-index:5;background-image: url('main.png');}
og denne markup ...
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"
http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"><html>
<!--
XHTML 1.0 Strict
Document type as defined on
http://www.w3.org/TR/xhtml1/-->
<head>
<title>Velkommen til Glad-cs.com</title>
<style type="text/css">
@import url(style.css);
</style>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1" />
<script type="text/javascript">
function correctPNG()
{
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
}
}fnLoadPngs();
}
function fnLoadPngs() {
var rslt = navigator.appVersion.match(/MSIE (\d+\.\d+)/, '');
var itsAllGood = (rslt != null && Number(rslt[1]) >= 5.5);
for (var i = document.all.length - 1, obj = null; (obj = document.all[i]); i--) {
if (itsAllGood && obj.currentStyle.backgroundImage.match(/\.png/i) != null) {
this.fnFixPng(obj);
obj.attachEvent("onpropertychange", this.fnPropertyChanged);
}
}
}
function fnPropertyChanged() {
if (window.event.propertyName == "style.backgroundImage") {
var el = window.event.srcElement;
if (!el.currentStyle.backgroundImage.match(/x\.gif/i)) {
var bg = el.currentStyle.backgroundImage;
var src = bg.substring(5,bg.length-2);
el.filters.item(0).src = src;
el.style.backgroundImage = "url(x.gif)";
}
}
}
function fnFixPng(obj) {
var bg = obj.currentStyle.backgroundImage;
var src = bg.substring(5,bg.length-2);
obj.style.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='" + src + "', sizingMethod='scale')";
obj.style.background = "transparent";
}
startList = function() {
if (document.all&&document.getElementById) {
navRoot = document.getElementById("nav");
for (i=0; i<navRoot.childNodes.length; i++) {
node = navRoot.childNodes[i];
if (node.nodeName=="LI") {
node.onmouseover=function() {alert(1);
this.className+=" over";
}
node.onmouseout=function() {
this.className=this.className.replace(" over", "");
}
}
}
}
}
if(window.attachEvent)window.attachEvent("onload", function(){correctPNG();startList();});
else window.onload=startList;
</script>
</head>
<body>
<div id="content2"></div><div id="content">
<div id="navigation">
<ul id="nav">
<li><h2><a href="">Forside </a></h2>
</li>
<li><h2><a href="">Nyheder </a></h2>
</li>
<li><h2><a href="">Produkter </a></h2>
<ul>
<li><a href="#">Masslinn</a></li>
<li><a href="blank.htm">Quick & Clean</a></li>
<li>Vendor</li>
<li><a href="#">Maskiner</a></li>
<li><a href="#">Kemi</a></li>
<li><a href="#">Rekvisitter</a></li>
</ul>
</li>
<li><h2><a href="">Dokumentation</a></h2>
<ul>
<li><a href="#">Rådgivning</a></li>
<li><a href="#">Salg / levering</a></li>
<li><a href="#">Ordliste</a></li>
</ul>
</li>
<li><h2><a href="">kontakt</a></h2>
</li>
<li><h2><a href="">Om os</a></h2>
<ul>
<li><a href="#">Svanemærkning</a></li>
<li><a href="#">Kemi</a></li>
</ul>
</li>
</ul>
</div>
<div id="main">
<h1>Hej med dig Glad...</h1><p>laaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaang tekst!</p>
</div>
<div id="footer">
<h3>Glad Cleaning System. Vallensbækvej 165, DK-2625 Vallensbæk. Tlf: 43 62 19 43 | Fax: 43 62 19 23</h3>
</div>
</div>
</body>
</html>
(har lige et par produkter der skal fotograferes - men fejlen bør være ovenstående ... uhm, desværre ... men, lad os håbe at IE 7 ikke har problemer med png overhovedet - det ville være rart :) ) ... jeg har sat en alert inde i startlist for at checke funktionen ...
Ny bruger
Nybegynder
Opret
Preview
