[HTML / CSS] Transparante achtergrond in IE

[Verwijderd]

De kans is groot dat je na het lezen van deze titel denkt dat het antwoord te simpel voor woorden is. Dit was voor mij ook zo. Totdat ik besloot over te schakelen van Inline Frames naar 'normale' Frames. Daar begon de hoofdpijn.

Het situatie is als volgt.
Ik geef in mijn index file in een stuk css in de header van de pagina een achtergrond kleur aan. Tevens plaats ik in die zelfde header een achtergrond plaatje. Dit plaatje moet over de hele pagina zichtbaar zijn. Vandaar dat ik dit niet in op de individuele frame pagina's kan regelen. Tot nu toe geen problemen. Om er voor te zorgen dat dit plaatje zichtbaar blijft heb ik voor alle pagina's die in dit frame geladen worden een transparante achtergrond ingesteld. Omdat IE hier weer eens moeilijk over doet heb ik in de IFRAME tag allowTransparency="true" toegevoegd. Prima, het werkt. Het vreemde is echter dat zodra ik over ga naar normale frames, met exact dezelfde site en weer de waarde allowTransparency="true" toevoeg, IE ineens besluit het niet meer weer te geven. In plaats daarvan krijg ik een volledige witte achtergrond over mijn plaatje heen gerennderd. Blijkbaar slikt IE de transparante achtergrond nu niet meer.

Dit terwijl zelf de microsoft site aangeeft dat allowTransparency="true" in zowel IFRAMES als FRAMES tags gebruikt mag worden.

Probleem is dus:
Als ik van IFRAMES naar FRAMES overga geeft IE (Firefox werkt natuurlijk wel) krijg ik ineens een witte achtergrond. Onder deze witte achtergrond bevindt zich wel de goede achtergrond. Dat wit wordt er dus overheen geplaatst omdat IE de transparante achtergrond ineens niet meer pikt.

De code met IFRAMES die wel werkt:

HTML:

<IFRAME NAME="menu" SRC="menuttx.html" width="100%" HEIGHT="320" FRAMEBORDER="0" SCROLLING="auto" allowTransparency="true"> </IFRAME>
</center>
<IFRAME NAME="ttx" SRC="ttx.html"  width="100%" height="100%" FRAMEBORDER="0" SCROLLING="no" allowTransparency="true"> </IFRAME>
</div>

Dit werkt dus niet:

HTML:

<frameset rows="10%,90%" border="1">
 <frame allowTransparency="true" frameborder="0" noresize="noresize" src="menuttx.html" name="menu" scrolling="auto" />
 <frame allowTransparency="true" frameborder="0" noresize="noresize" src="ttx.html"  name="ttx" scrolling="no"/>
</frameset>

De CSS met de achtergrond (index pagina)

Cascading Stylesheet:

html, body {
height: 100%;
background-color: #fec9c0;
background-image: url(uitrans2.png);background-position:100% 0%; background-repeat: no-repeat;background-attachment: fixed; 
}

Transparantie andere pagina's

Cascading Stylesheet:

body {background:none transparent;}

Wie helpt mij?

[RobIII]

quote: http://msdn.microsoft.com/en-us/library/ms533072(VS.85).aspx

ALLOWTRANSPARENCY Attribute
...
This property is a Microsoft extension to HTML

'Nuff said
...en dan ook nog eens HTML 3.2 We leven in 2009 hoor Je ziet trouwens ook al dat onze code-highlighter het attribuut grijs maakt.

Waarom überhaupt (i)frames?

[ Voor 45% gewijzigd door RobIII op 02-04-2009 19:40 ]

[Verwijderd]

Omdat dit wat scheelt in laad tijd. Ook omdat ik dat zelf handiger werken vind. Daarnaast kijkt de gebruiker nooit tegen een wit scherm aan. Maar dat terzijde waarom werkt het in iframes wel en in frames niet ?

[RobIII]

Verwijderd schreef op donderdag 02 april 2009 @ 19:40:
Omdat dit wat scheelt in laad tijd.

Nou; wel een hele milliseconde? Heb je dit gemeten? Het zal vast wat schelen, maar is dat het gedonder waard? En je bent op de hoogte van alle nadelen van frames anno 2009? Frames hebben tegenwoordig nog maar amper nut/toepassingsgebied. Ze zijn handig om pagina's van derden (externe/andere domeinen) te framen en dan heb je het zo'n beetje gehad...

Verwijderd schreef op donderdag 02 april 2009 @ 19:40:
Maar dat terzijde waarom werkt het in iframes wel en in frames niet ?

Omdat het deprecated MS proprietary is en stamt uit het jaar knoop? Ik kan me niet voorstellen dat je enige medewerking van eender welke browser (ook IE) kunt verwachten. Als het al werkt is het puur geluk/toeval en niet gegarandeerd.

Ik zou hier geen tijd in steken en eerst even zorgen dat ik bij de tijd zou zijn met mijn HTML

[ Voor 44% gewijzigd door RobIII op 02-04-2009 19:52 ]

[Cartman!]

Met RobIII: gewoon leren hoe je echt moet html-en anno 2009 ipv. met verouderde technieken werken. Browsers kunnen geweldig cachen tegenwoordig en met de snelle verbindingen die de meeste mensen hebben zijn pagina's de eerste keer ook al snel ingeladen. Met een serverside taal (PHP, ASP(.NET)) kun je heel makkelijk menu, header, footer etc. inladen zodat je bij n wijziging maar 1 file hoeft aan te passen.