PNG transparantie in IE en FF
We gaan maar eens beginnen.
Ten eerste maken we twee id's aan in css.
De ene id gaan we maken voor IE (Internet Xplorer), zodat deze transparante PNG's goed weergeeft en geen lelijk grijs vak eromheen. De tweede wordt voor de andere browsers gebruikt, waaronder FF (FireFox). Deze hebben namelijk wel een fatsoenlijk PNG support.
#pngIE {
fillter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src=locatie/naamplaatje.png');
background-repeat:no-repeat;
}
#pngFF{
background-image:url(locatie/naamplaatje.png);
background-repeat:no-repeat;
}
In deze id's kun je natuurlijk de andere attributen naar vrije wil gebruik. Denk hierbij aan width en height en dergelijke.
Nu je dat hebt toegevoegd aan je stylesheet, heb je nog geen stylesheet sla bovenstaande code dan op als: styles.css.
Nu de PHP code:
De code zet je neer op de plek waar je de id wilt gebruiken. Dus waar je PNG plaatje komt te staan.
Hier de code:
Het bovenstaande script bekijkt wat de gebruikers zijn browser is en wijst vervolgens het goede id toe.
Vergeet bovenaan tussen je <head> en </head> niet de volgende regel neer te zetten om de stylsheet te includen:
<link href="styles.css" rel="stylesheet" type="text/css">
Zo nu heb je je PNG'tje goed zichtbaar in IE en komt hij ook te voorschjn zonder kleerscheuren in FF