Zum Inhalt springen

Tranparenten menühintergrund per PNG

Erstellt am 8. Februar 2005 · 1 Antwort · letzte Antwort am 8. Februar 2005

Tags: HTML & CSS, Frage

TK ·

Hallöchen,

hab echt schon alles durchsucht hier im forum, und in tausend anderen foren... ^^

also, habe ein TMENU erstellt, das in tabellen gepackt...in der obersten tabelle sind die Links, mit gif's als zellen hintergründen, damit ich meine ränder da habe. ist aber nicht das problem. dann unter dieser tabelle noch eine mit einem weißen hintergrund, der ich dann die deckkraft per opacity geklaut habe, damit die leicht weiß durchscheint...auch kein thema...

so und nun steh ich vor einem problem!!!

habe unter diesen beiden tabellen noch eine tabelle gelegt, mit einem png, das einen verlauf hat von weiß nach transparent....im firefox kein thema...nur der IE hatte schwierigkeiten...war grau das png!
so dann hab ich mir ne anleitung für nen filter gesucht (AlphaImageLoader) damit der IE meine png's auch transparent anzeigt....
das problem ist jetzt bloß...die links die über dem png liegen werden nicht mehr angezeigt...!! :-/

hier mal mein menuscript:

LINKS = HMENU
LINKS.special = directory
LINKS.special.value = 7
LINKS.entryLevel = 1
LINKS.1 = TMENU
LINKS.1.NO = 1
LINKS.1.NO.ATagParams = class="linklinks"
LINKS.1.NO.linkWrap = <table width="130" border="0" cellpadding="0" cellspacing="0"><tr><td class="button"><table width="130" border="0" cellpadding="0" cellspacing="0" class="opacity1"><tr><td bgcolor="FFFFFF"><table width="130" cellpadding="0" cellspacing="0" class="linklinks"><tr><td background="fileadmin/images/menuhg-01.gif" height="40"><b>&nbsp;&nbsp;|*|</b></td></tr><tr><td background="fileadmin/images/menuhg-01.gif" height="40"><b>&nbsp;&nbsp;|*|</b></td></tr><tr><td background="fileadmin/images/menuhg-02.gif" height="40"><b>&nbsp;&nbsp;|</b></td></tr></table></td></tr></table></td></tr></table>

und der auszug aus der CSS für den filter:

td.button
{
filter:progid😃XImageTransform.Microsoft.AlphaImageLoader(enabled=true sizingMethod=scale src='fileadmin/images/hg-button.png');
}
td.button[class]{background-image:url('../fileadmin/images/hg-button.png');}

hoffe mir kann nun wer erklären wie ich die links im IE zum funktionieren bringe...(im firefox laufen die ja)

thx schonmal im vorraus

gruß
tk

TK ·

hat mir zwar niemand geholfen, aber hab das problem selber gelößt.... =)

man muss noch einen kleinen html tag vor die links knallen also nen "div-tag"

<div style="position: relative; margin: 0; padding: 0;"></div>
menu sieht in meinem fall dann so aus:

LINKS = HMENU
LINKS.special = directory
LINKS.special.value = 7
LINKS.entryLevel = 1
LINKS.1 = TMENU
LINKS.1.NO = 1
LINKS.1.NO.ATagParams = class="linklinks"
LINKS.1.NO.linkWrap = <table width="130" border="0" cellpadding="0" cellspacing="0"><tr><td class="button"><table width="130" border="0" cellpadding="0" cellspacing="0" class="opacity1"><tr><td bgcolor="FFFFFF"><table width="130" cellpadding="0" cellspacing="0" class="linklinks"><tr><td background="fileadmin/images/menuhg-01.gif" height="40"><div style="position: relative; margin: 0; padding: 0;"><b>&nbsp;&nbsp;|*|</b></div></td></tr><tr><td background="fileadmin/images/menuhg-01.gif" height="40"><div style="position: relative; margin: 0; padding: 0;"><b>&nbsp;&nbsp;|*|</b></div></td></tr><tr><td background="fileadmin/images/menuhg-02.gif" height="40"><div style="position: relative; margin: 0; padding: 0;"><b>&nbsp;&nbsp;|</b></div></td></tr></table></td></tr></table></td></tr></table>

naja is ja nur für den fall sollte auch mal wer dieses problem haben ;-)

gruß
tk