Verschillende stylesheets aantoepen bij verschillende browsers

[hansjuh]

Verschillende stylesheets aanroepen bij verschillende browsers

Hoi,

Ik wil een website maken die gebruik maakt van transparente png's. Aangezien die niet goed weer worden gegeven in IE 5.5 en 6 wil ik 2 stylesheets gaan gebruiken voor de verschillende browsers.

Kan dit met javascript? Of moet het met php?

 

[Johantrax]

dat zou via javascript kunnen
Het eenvoudigste lijkt me eigenlijk via conditionele commentaar..

 

[hansjuh]

En hoe doe je dat? Ik weet (bijna) niets van javascript.

 

[Johantrax]

klik (google was echt niet zo moeilijk...)

 

[aaajeetee]

Er bestaan ook filters voor transparante PNG's

Edit: kijk hier en hier eens

 

[hansjuh]

Je bedoeld de alpa filter? Ik heb er al een stuk of 5 geprobeert, met verschillende scripts en dergelijke, maar geen enkele werkte helemaal goed voor IE 5.5 en 6.

Ik gebruik afbeeldingen die in de css gedefinieerd zijn en zich herhalen. Als je een werkend script zou vinden, zou ik erg blij zijn. Maar ik heb de hoop inmiddels opgegeven...

 

[aaajeetee]

Je bedoeld de alpa filter? Ik heb er al een stuk of 5 geprobeert, met verschillende scripts en dergelijke, maar geen enkele werkte helemaal goed voor IE 5.5 en 6.

Ik gebruik afbeeldingen die in de css gedefinieerd zijn en zich herhalen. Als je een werkend script zou vinden, zou ik erg blij zijn. Maar ik heb de hoop inmiddels opgegeven...

http://www.opstarten.nl.
De logo's van de verschillende modules / boxen zijn transparante PNG's (http://www.opstarten.nl/images/icons/category_header_7.png bijv.). Die worden in IE5.5, 6, 7, FF2 en Opera 8/9 goed weergegeven.

Voorbeeld 1 (hierbij is het plaatje als achtergrond ingesteld):

<div style = "filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(sizingMethod=crop, src='images/icons/category_header_12.png'); background-image: url('images/icons/category_header_12.png'); _background-image: none;"/>

en nog een ander voorbeeld (hier is het plaatje 'los'):

<div style = "filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='images/button_bugtrack.gif');">
    <img src = "images/button_bugtrack.gif" style = "filter:progid:DXImageTransform.Microsoft.Alpha(opacity=0);"/>
</div>