-oo Nicole Bauer - Digital Portfolio oo-

Digital Portfolio » Goodies » Tutorials » Transparentes Iframe

Transparentes Iframe

Zunächst legen wir die Einstellungen für das Iframe fest:

<iframe src="iframe-content.htm" frameborder="0" name="iframe" scrolling="auto" style="filter: Chroma(color=#EBDCF8)" width="250" height="200">

src:	Der Inhalt des Iframes
frameborder:	0 für kein Rahmen, 1 für Rahmen
name:	Name es Iframes (wichtig, falls ihr z. B. von der Navigation aus darauf zugreifen wollt...)
scrolling:	hiermit könnt ihr festlegen, ob die Scrollbar angezeigt werden soll (auto für automatisch -> wenn eine gebraucht wird wird sie eingeblendet, sonst nicht; yes -> die Scrollbar wird immer angezeigt; no -> die Scrollbar wird nie angezeigt)
width/height:	Breite und Höhe des Iframes

Mit dieser Anweisung: style="filter:Chroma(color=#EBDCF8)" wird die Farbe #EBDCF8 durchsichtig dargestellt

Das heißt jede Datei, die im Iframe durchsichtig dargestellt werden soll (in meinem Fall iframe-content.htm) muss diese Farbe als Hintergrundfarbe haben:

<bgcolor="#EBDCF8">

Wichtig: Diese Farbe sollte in eurem Design sonst nicht vorkommen! Man könnte zum Beispiel ein Giftgrün (#00FF00) nehmen...
Das funktioniert allerdings nur für den Internet Explorer (ab 5.0)!
Alle anderen Browser stellen den angegebenen Hintergrund dar, deshalb solltet ihr eine Farbe nehmen, die zwar in eurem Design nicht vorkommt, aber trotzdem dazu passt...

So sieht das ganze im Internet Explorer 6.0 aus, so z. B. mit Netscape 7.0

Meine Beispieldatei findet ihr hier

Die Scrollbar sieht jetzt natürlich nicht so toll aus dazu...
Deshalb hab ich auch dort allem außer den Pfeilen die transparenteFarbe #EBDCF8 zugeordnet:

[Disclaimer]