Pichelmother
New member
Hallo,
ich habe bis jetzt erfolglos versucht, dem IE 5.5+ das Anzeigen von transparenten png-Bildern bei zu bringen. Ich habe es mit dem AlphaImageLoader versucht, aber irgendwie funzt es nicht.
Die Container und ähnliches habe ich normal im html code geschrieben. Den Style hab ich barrierefrei mit css gemacht und diese ausgelagert.
Anbei sind die jeweiligen Codes:
das ist ein Auszug der HTML-Datei, es geht dabei um den Bereich der pagerubrik und ff.
und hier ist die passende CSS-Code
Ich hoffe jemand hat der einen guten Vorschlag
Danke schon mal!!!
ich habe bis jetzt erfolglos versucht, dem IE 5.5+ das Anzeigen von transparenten png-Bildern bei zu bringen. Ich habe es mit dem AlphaImageLoader versucht, aber irgendwie funzt es nicht.
Die Container und ähnliches habe ich normal im html code geschrieben. Den Style hab ich barrierefrei mit css gemacht und diese ausgelagert.
Anbei sind die jeweiligen Codes:
das ist ein Auszug der HTML-Datei, es geht dabei um den Bereich der pagerubrik und ff.
Code:
<body>
<div id="page_margins">
<div id="page" class="hold_floats">
<div id="header" class="headercontent">
<!-- WEBREDAK_test: class=headercontent verhindert Ueberlauf des Farbverlaufs hinter den Seitenrubricken aber verursacht Fehler in ie7 -->
<div id="topnav">
<!-- Start: Skiplink-Navigation -->
<a class="skip" href="#navigation" title="Direkt zur Navigation springen">Zur
Navigation springen</a> <a class="skip" href="#content" title="Direkt zum Inhalt springen">Zum
Inhalt springen</a>
<!-- Ende: Skiplink-Navigation -->
<!-- <a href="#">Impressum</a> Moeglich im Seitenkopf oben rechts -->
</div>
<a href="http://www.uni-lueneburg.de" title="back to unihomepage"> <img src=".././img/unilogo.gif" alt="Logo Universitaet Lueneburg - link zur homepage" />
</a>
<div id="pagerubrik">
<p id="seitenrubrik01">Hauptrubrik / Bereichszuordnung dieser Seite</p>
<p class="seitenrubrik02">Titel dieser Seite</p>
</div>
</div>
<!-- #nav: Hauptnavigation -->
<div id="nav"> <a id="navigation" name="navigation"></a>
<!-- Skiplink-Anker: Navigation -->
<div id="nav_main">
<ul>
<li id="current"><a href="#">Button 1</a></li>
<li><a href="#">Button 2</a></li>
<li><a href="#">Button 3</a></li>
<li><a href="#">Button 4</a></li>
<li><a href="#">Button 5</a></li>
</ul>
</div>
</div>und hier ist die passende CSS-Code
Code:
/* #pagerubrik - von WEBREDAK */
#pagerubrik {
position: relative;
top: 38px;
left: 240px; /* 22.5%; */
color: #fff;
text-align: left; /* Erforderlich, damit im Opera 6 wirklich rechts plaziert ! */
/* z-index: 21; */
filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='24bit-792x52px.png', sizingMethod='img');
}
#seitenrubrik01 {/* #pagerubrik h1 von WEBREDAK */
font-size: 1.2em; font-weight:bold; color: #333;
margin: 0px; padding: 10px 1px 10px 10px; border-bottom: 0;
background: none;
background: url(../../img/24bit-792x52px.png);
/*filter:Alpha(opacity=70, style=0);*/
/*das transparente Bild wird im IE 5 & 6 ausgeblendet */
filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='../../img/24bit-792x52px.png'); /* wird nur im IE genutzt, Filter sollte den Fehler beheben, leider nicht valide */
background-position: 0 -0.5em;
background-repeat:repeat-y;
}
p.seitenrubrik02 { /* #pagerubrik h2 von WEBREDAK */
font-size: 0.93em; font-weight:bold; color: #666;
background: transparent;
background-image:url(../../img/pagerubrikverlauf_24.png);
/background-image:url();
filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(enabele=true, src='/../img/pagerubrikverlauf_24.png', #sizingMethod='scale');
background-position: 0 -0.5em; /* left -0.5em */
background-repeat:repeat-y;
}
/* Formatierung der Fußzeile ORIGINAL
#footer { color:#888; background:#fff; margin: 0 1em; padding: 1em 0; border-top: 1px #ddd solid; line-height: 2em;}
*/Ich hoffe jemand hat der einen guten Vorschlag
Danke schon mal!!!
