Transparantie probleem IE

Ik ben bezig met mijn site, www.niekvangalen.nl en ik krijg het maar niet goed voor elkaar om 24 bits PNG afbeeldingen met transparantie goed te krijgen in IE voor Windows. Sowieso valt de hele site een beetje uit elkaar, ik ben eigenlijk op zoek naar links die me kunnen helpen mijn site gereed te maken voor IE, immers de meeste mensen gebruiken IE.

IE ondersteund geen transparante PNG's, it's easy as that :?

/ vanaf versie 7 wel, … (maar die is er nog niet)

Ik weet dat het kan, er bestaat een hack voor, maar het lukt me niet om het goed te krijgen, en is er anders een alternatief?

// Correctly handle PNG transparency in Win IE 5.5 or higher. // http://homepage.ntlworld.com/bobosola. Updated 02-March-2004

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
}
}
}
window.attachEvent(“onload”, correctPNG);

[quote:51d10b8032="rulus"]IE ondersteund geen transparante PNG's, it's easy as that :?

/ vanaf versie 7 wel, … (maar die is er nog niet)[/quote:51d10b8032]

Klopt, niet standaard. Maar hier is wel een truukje voor. Je kan namelijk de AlphaImageLoader functie gebruiken. Raar dat ze deze neit standaard aanroepen voor png maar goed. Dan maar handmatig :lol:

De code:

<span style=“width:100px;height:50px; filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src=‘image.png’);”><img style=“filter:progid:DXImageTransform.Microsoft.Alpha(opacity=0);” src=“image.png” width=“100” height=“50” border=“0” alt=""></span>

Ik heb echt een hekel aan IE :P

Maar toch bedankt voor de antwoorden alvast.

[quote:86d9438905="nvgalen"]Ik heb echt een hekel aan IE :P

Maar toch bedankt voor de antwoorden alvast.[/quote:86d9438905]

Hier nog iemand. Ben verdomme 2x zolang bezig om sites voor zowel Safari. firefox en IE werkende te krijgen.

Een eenvoudigere oplossing die werkt als je site geen ingewikkelde achtergronden gebruikt, is om de PNG op te slaan met een achtergrondkleur die overeenkomt met die van de pagina. Heb je bijvoorbeeld een pagina met een bijna-witte achtergrond waar een beetje een patroontje in zit, dan geef je de PNG dezelfde bijna-witte kleur mee als achtergrondkleur; in Safari, Firefox, Opera, enz. zal hij doorzichtig zijn en je het patroontje zien, en in IE zie je de kleur zonder patroontje. Dit valt niet echt op, tenminste niet als je, zoals al vermeld, geen ingewikkelde achtergronden gebruikt.

[quote:5bcab5ff5c="Jakko Westerbeke"]Een eenvoudigere oplossing die werkt als je site geen ingewikkelde achtergronden gebruikt, is om de PNG op te slaan met een achtergrondkleur die overeenkomt met die van de pagina. Heb je bijvoorbeeld een pagina met een bijna-witte achtergrond waar een beetje een patroontje in zit, dan geef je de PNG dezelfde bijna-witte kleur mee als achtergrondkleur; in Safari, Firefox, Opera, enz. zal hij doorzichtig zijn en je het patroontje zien, en in IE zie je de kleur zonder patroontje. Dit valt niet echt op, tenminste niet als je, zoals al vermeld, geen ingewikkelde achtergronden gebruikt.[/quote:5bcab5ff5c]

Inderdaad, ik gebruik een foto :wink:

[quote:215d00f93b="rulus"]IE ondersteund geen transparante PNG's, it's easy as that :?

/ vanaf versie 7 wel, … (maar die is er nog niet)[/quote:215d00f93b]
de eerste beta wel

[quote:c36caf8186]de eerste beta wel[/quote:c36caf8186]

dus ?
Vergeten we IE6 toch gewoon ? Er is tenslotte een beta van IE7 . . . . . .

[quote:3f564a25d0="levski"][quote:3f564a25d0]de eerste beta wel[/quote:3f564a25d0]

dus ?
Vergeten we IE6 toch gewoon ? Er is tenslotte een beta van IE7 . . . . . .[/quote:3f564a25d0]

Plus dat de markt van IE 6-gebruikers gewoonweg te klein is om aandacht aan te besteden ;).

@alamac

Ik zal de volgende keer als ik iets cynisch bedoel dat erbij vermelden, dan snapt iedereen dat . . .
Wij arme webdesignerts moeten nog jarenlang de zware last van IE6 en lager met ons mee torsen…

[quote:765f181a6d="levski"]@alamac

Ik zal de volgende keer als ik iets cynisch bedoel dat erbij vermelden, dan snapt iedereen dat . . .
Wij arme webdesignerts moeten nog jarenlang de zware last van IE6 en lager met ons mee torsen…[/quote:765f181a6d]

En ik erger mij eraan dood dat IE niet eens HTML fatsoenlijk aankan, laat staan XHTML, om van CSS nog maar te zwijgen.

[quote:765f181a6d=“levski”]Ik zal de volgende keer als ik iets cynisch bedoel dat erbij vermelden, dan snapt iedereen dat . . .[/quote:765f181a6d]

Bedankt! Weer wat bijgeleerd over de mentaliteit van de Hollanders. “Wie is hier de baas!”…

[quote:1d60026393="à la Mac"] Bedankt! Weer wat bijgeleerd over de mentaliteit van de Hollanders. "Wie is hier de baas!"...[/quote:1d60026393]

Misschien dat je je hier dan meer thuis voelt: http://www.intermactivity.be/

[quote:ab5725ac27="nvgalen"]Inderdaad, ik gebruik een foto :wink:[/quote:ab5725ac27] Tja, dan zul je inderdaad voor de ingewikkeldere oplossing moeten gaan :)