• Jetzt anmelden. Es dauert nur 2 Minuten und ist kostenlos!

Hintergrund verdunkeln, IE zeigt Probleme

MasteR ChieF

Mitglied
Hallo Zusammen

Ich würde gerne, bei einem Knopfdruck via Javascript den kompletten Hintergrund abdunkeln (transparent). Das ist grundsätzlich auch kein Problem, habe das folgendermassen gelöst:

Code:
padding: 0;
margin: 0;
top: 0;
left: 0;
position: absolute;
width: 100%;
height: 100%;
z-index: 1;
background-color: #000000;
opacity: 0.4;
filter:alpha(opacity=40);

Auf den ersten Blick scheint das im IE und im FF zu funktionieren. Sobald ich aber eine Scrollleiste habe (da der INhalt zu lange ist) und dann den Hintergrund "verdunkle", funktioniert das im FF aber im IE nicht.

Wenn ich da nun Scrolle kommt unten die Seite nicht "verdunkelt". Es scheint als würde der IE tatsächlich nur die Bildschirmgrösser abdunkeln.

Könnt ihr mir sagen warum? bzw. wie ich das lösen kann?

Danke und Gruss
Master Chief
 
Versuchs mal anstatt % Angaben einfach Pixel zu verwenden die viel Höher liegen als ein Viewport sein wird. Beispielsweise

width:4000px;
height:4000px;

Ist keine richtig schöne Lösung aber etwas besseres wüsste ich auf die schnelle auch nicht.
 
hi

Das Problem dann ist, dass sich die Seite halt vergrösert!

Sprich, wenn ich keinen Scrollbalken habe und das so angebe wie du vorgeschlagen hast, gibt es Horizontal wie Vertikal einen Scrollbalken (klar, denn er macht das DIV mit dem Inhalt so gross).

Oder muss ich das anders lösen als mit einem Div.

Ich habe nach dem <body> ein <div id="xxx"></div>! und die oben angegebenen StyleAngaben, werden dann dem xxx zugewiesen!

EDIT:
Habe gerade gemerkt, das es im Firefox auch nicht richtig angezeigt wird...
 
Code:
#xxx{
background-color: #000000;
 filter:Alpha(opacity=90);
 -moz-opacity:.9;
 opacity:.9;
 position: fixed;
 left: 0px;
 top: 0px;
 z-index: 5;
 width: 100%;
 height: 100%;


}

Musst du dann nur noch an deinen Einstellungen anpassen.
 
Hey, super das funktioniert.
Hätte ich auch selber drauf kommen müssen, position: fixed, macht eigentlich schon Sinn.

Danke für deine schnelle Hilfe!
 
Ja das wäre die Alternative gewesen, habe das auch schon gemacht gehabt. Jedoch die Lösung von creative-webdesigns um einiges Edler.

Vorher hatte ich einfach beim KLick, den Hintergrund verdunktelt und die Scrollleisten ausgeblendet! Hat auch funktioniert, aber wie gesagt, ist nicht gerade das gelbe vom Ei!
 
Zurück
Oben