måndag 19 april 2010

Opacity i Internet Explorer

I CSS3 finns egenskapen opacity för att bestämma ett lagers transparens. Denna egenskap fungerar både i senare versioner av Firefox och Chrome. I Internet Explorer har man länge kunnat göra samma sak med filter: alpha(opacity = 50);. Detta har dock inte fungerat för lager som är relativt positionerade (vilket är nästan alla lager).

Idag hittade jag dock en lösning på detta. Om man sätter zoom: 1; så börjar filtret fungera även för relativt positionerade lager. Så ett crossbrowser-säkert sätt att göra ett lager halvtransparent är detta:

.halvtransparent {
   opacity: 0.5;
   -moz-opacity:0.5;
   filter: alpha(opacity = 50);
   zoom: 1;
}

Inga kommentarer:

Skicka en kommentar