Milan Kryl

Kryl Blog - RSS

Průhlednost v MSIE i v Mozille (updated)

04. 04. 2004 - 00:33

Ove Klykken radí, jak na průhlednost v prohlížečích IE a Mozilla najednou. (CSS Transparency for Internet Explorer (IE) and Mozilla)

Zatím není žádná jednotná a hlavně standardní cesta, jak průhlednosti (hlavně poloprůhlednosti) dosáhnout. Naštěstí tomu bude jinak v CSS3 (ale to je ještě hodně daleká cesta, než se kompletní podpora CSS3 dostane do všech používaných prohlížečů - to by musela přinést pro uživatele něco velmi převratného.)

MSIE používá vlastní atribut filter:alpha(opacity=30), mozilla naopak vlastních atributů -moz-opacity: 0.3 (ještě ke všemu stejné hodnoty nedávají stejnou průhlednost)

CSS

<style type="text/css">
<!-- 
// Parent box with background image
#bg { width:400px; height:300px; background:url(leaf.gif) repeat;}

// This is the white transparent area the text will be within
#ninety { width:300px; margin:50px; background:#fff; 
          filter:alpha(opacity=80); -moz-opacity:0.8; }

// '*' means 'every child' basically a wildcard for everything within #ninety 
#ninety * {filter:alpha(opacity=100); -moz-opacity:1.0; position: relative;}

// sets margin value to the div inside #ninety#ninety div {margin: 20px;}
-->
</style>

HTML

<div id="bg">
	<div id="ninety">
		<div>80% Lorem ipsum dolor sit amet, consectetuer adipiscing etc. etc.</div>
	</div>
</div>

Pokud naopak chcete donutit MSIE, aby uměl průhlednost PNG obrázků, tak to už dnes není taky žádný problém. Stačí se mrknout na stránky Yuhůa (Poloprůhledný PNG v Exploreru), stáhnout si utilitku, která daný PNG soubor ošéfuje (sice jej trošku zvětší - přidá jeden kanál), ale všechno funguje jak má i v MSIE. ještě stále není možné. Byl to Yuhůův apríl. Bral jsem to natolik okrajově, že jsem to nezkoušel a jen jsem přidal odkaz. Hmm moje chyba.:-)Však počkej Dušane, příští rok ti to nějak oplatím.8-)

 

Tip: Nevíte čím obdarovat nejbližší? Nechte je napsat Ježíškovi.