Alpha transparantie

[Emielio]

Ik zag een mooie techniek in een website van iemand: Klik (Let op deze site werkt niet in IE, wel in andere browsers)
Hier zie je een half transparante witte laag over een achtergrond.
Nou vind ik dit een prachtige techniek die ik graag zou toepassen, maar deze site werkt niet in IE!
Nou Werkt helaas een groot deel van de mensen met IE dus ben ik verplicht deze site ook voor IE te laten werken.

Nou is mijn vraag of zo'n techniek als deze ook voor IE werkend te krijgen is?

[BasieP]

yup dat kan, is een .htc voor nodig, zoek eens eens op 'htc transparent png IE' in google

[posttoast]

Die site maakt waarschijnlijk gebruik van semi-transparante PNG's. Die werken sowieso niet onder IE. Wel in versie 7 die dit jaar uitkomt trouwens.

Volgens mij kun je dit ook doen in IE met behulp van filters, maar dat is niet echt een nette oplossing (aangezien dat weer niet in andere browsers werkt).

[BasieP]

posttoast schreef op vrijdag 28 april 2006 @ 18:24:
Die site maakt waarschijnlijk gebruik van semi-transparante PNG's. Die werken sowieso niet onder IE. Wel in versie 7 die dit jaar uitkomt trouwens.

Volgens mij kun je dit ook doen in IE met behulp van filters, maar dat is niet echt een nette oplossing (aangezien dat weer niet in andere browsers werkt).

native ondersteund IE 6 idd geen alpha blend in png's , maar daar is dus een workaround/fix voor.
Verder heb je voor elke (redelijke) browser volgens mij wel filter hoor, (al heten ze dan wat anders)

het nadeel daarvan is alleen dat alles overeft, dus als je een divje 50% transparant maakt, word de text, en plaatjes daarop dat ook (wat je vaak niet wil)

[djexplo]

Gebruik "filter: alpha(opacity=50);", om in IE5/6 half doorzichtig te worden.
Zie ook http://www.quirksmode.org/css/opacity.html.

het nadeel daarvan is alleen dat alles overeft, dus als je een divje 50% transparant maakt, word de text, en plaatjes daarop dat ook (wat je vaak niet wil)

Dat is gewoon een kwestie van 2 div'jes over elkaar heen gebruiken, met één de text en de andere het witte blok.

[ Voor 100% gewijzigd door djexplo op 28-04-2006 18:33 ]

[Zoefff]

djexplo schreef op vrijdag 28 april 2006 @ 18:29:
Gebruik "filter: alpha(opacity=50);", om in IE5/6 half doorzichtig te worden.
Zie ook http://www.quirksmode.org/css/opacity.html.

[...]
Dat is gewoon een kwestie van 2 div'jes over elkaar heen gebruiken, met één de text en de andere het witte blok.

Gebruik dan als achtergrond gewoon een PNG met alpha transparantie, dat lijkt me een nettere oplossing

[mithras]

Zoefff schreef op vrijdag 28 april 2006 @ 18:40:
[...]

Gebruik dan als achtergrond gewoon een PNG met alpha transparantie, dat lijkt me een nettere oplossing

Maar dan mis je juist de ondersteuning van alfa blend van png's in IE

[Zoefff]

Nou wou ik gaan zeggen dat je daarvoor een behaviour kan toevoegen dat het dan prima werkt. Voor normale PNG's als plaatje werkt dat ook uitstekend, maar als je er een achtergrond van maakt werkt het níet. Dus mijn argument gaat niet helemaal meer op

[Blaise]

maar als je er een achtergrond van maakt werkt het níet

Wel hoor, kijk hier maar: http://zopp.nl/dump/png/

[Blue-eagle]

Desnoods kan je het effect nog simuleren met een background gif die om-en-om een zwarte en transparante pixel heeft. Komt niet altijd even mooi over, en er zijn zeker beter oplossingen, maar het werkt wel (een beetje )

[Emielio]

Ik heb een beetje gekloot na aanleiding van deze link.
Dit is daar het resultaat van, maar hier krijg ik een dikke zwarte rand die ik niet terug zie in de link die ik van Blaise kreeg

[Blaise]

Die zwarte rand zit in het plaatje zelf, kan je er uitslopen in Photoshop, PSP of Gimp of zo.

[besmart]

Maar wat als je geavanceerde mouse over menu's hebt etc?
Installeer deze meuk javascript en alles is bassie

http://dean.edwards.name/IE7/