ik heb lang gedaan over hetzelfde probleem als jij.
en ik heb uiteindelijk na veel 5en en 6en het volgende resultaat berijkt (www.nvmac.nl/new) als wil je mijn js-script hebben het is alleen geen origineel meer. maar het werkt zovel voor back als foreground img. (met een beetje javascript kennis moet dat wel lukken.)
zo dat is beroerd nederlands zie ik nu. sorry daarvoor.
Die fix zet het nu recht,
Maar er is nu een andere fout.
Ik zie de background-image (png) niet meer :-(
Stukje css:
img, div {
behavior: url(iepngfix.htc)
}
#menubar {
width: 800px;
height: 49px;
position: absolute;
margin-top: 191px;
background-image: url(img/menubar-fill.png);
padding-top: 1px;
text-align: center;
border-left: 1px solid #000;
border-right: 1px solid #000;
/* Begin: Dit is alleen om het vlak aan te duiden :-) */
border: 2px dashed #FF0000;
/* Einde: Dit is alleen om het vlak aan te duiden :-) */
}
/*
Correctly handle PNG transparency in Win IE 5.5 & 6.
http://homepage.ntlworld.com/bobosola. Updated 18-Jan-2006.
Use in <HEAD> with DEFER keyword wrapped in conditional comments:
<!--[if lt IE 7]>
<script defer type="text/javascript" src="pngfix.js"></script>
<![endif]-->
*/
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
}
}
}
Bij de plaatjes in je body MOET je volgens mij de grote aangeven, anders werkt het niet maar dat weet ik zo gauw niet zeker :P (tis nog vroeg) het kan dus dat het niet perse nodig is.
Voor achtergronde van divjes, tables etc:
(In je css bestand zetten.)
Let op:
Hier kan het ook zijn dat je de grote aan moet geven, dit geldde voor één vande twee manier maar ik weet niet meer zeker welke.
Je moet beide stukjes css in je style sheet zetten, want de één werkt alleen in IE, en de andere alleen in FF
/* Deze fixed het voor IE*/
.head {
filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true, sizingMethod=scale src='...');
background-repeat: no-repeat; left: 20px; top: 20px; position: absolute;
height: 70px; width: 300px;
}
/* Deze fixed het voor FF */
.head[class] {
background-image:url(...);
background-repeat: no-repeat; left: 20px; top: 20px; position: absolute;
height: 70px; width: 300px;
}
En dan dus je table of div class="head" meegeven, of hoe je hem dan ook noemt in je css.
