2010-08-09 5 views
5

Ich habe eine "Saving ..." - Überlagerung, die das Zentrum eines unsichtbaren Divs besetzt, das 100% des Bildschirms abdeckt. Ich möchte, dass es unmöglich ist, mit den Elementen dahinter zu interagieren, dh mit den Schaltflächen, Formulareingaben usw. auswählen. Im Idealfall würde es nicht nur alle Mauseingaben erfassen, sondern auch die MouseOver-Effekte (also Cursoränderungen) der Elemente ignorieren unten. Es ist nicht für die Sicherheit oder irgendetwas, also muss es nicht luftdicht sein, hauptsächlich nur für die Ästhetik.Blockiert alle Eingabe hinter einem unsichtbaren Div in IE?

Firefox scheint genau dies standardmäßig zu tun, aber IE überhaupt nicht. Gibt es etwas einfaches, das ich verwenden kann, um dieses Verhalten in IE zu erzwingen?

+0

ein Link zu Ihrem JS und Ihrer Quelle wäre wirklich hilfreich. Pastebin und jsbin kommen in praktisch =) –

+0

Nichts Besonderes wirklich, das ist die CSS des Overlay div: http://pastebin.com/jYzYRwwZ Das allein reicht alle Eingaben in Firefox zu blockieren, aber IE lässt noch Sie verwenden alle Formulareingaben und solche unter dem div. –

Antwort

4

IE blockiert nur Benutzerinteraktion, wenn das div, das den Bildschirm abdeckt, eine Hintergrundfarbe hat. Wenn der Inhalt nicht ausgeblendet werden soll, legen Sie eine Hintergrundfarbe fest und legen Sie die Deckkraft auf 1% fest.

background-color: white; 
filter: alpha(opacity=1); 
opacity: 0.01; 
+4

Eigentlich ist die sauberere Alternative, unseren alten Freund, das 43 Byte transparente 'pixel.gif', aufzurufen und als Hintergrund für das Overlay div zu verwenden. Die Lösung, die Sie hier beschrieben, produziert 1% Weiß :) – gonchuki

+0

alter Freund! LOL ...: D –

0

Ich schlage vor, dass Sie in eine der vielen MooTools UI-Bibliotheken schauen, zum Beispiel Clientcides StickyWin Modal. Es verhindert bis zu einem gewissen Grad die Interaktion mit Dingen darunter (wie Sie sagten, meist ästhetisch). Der Benutzer kann noch die folgenden Dinge durchforsten und wenn sie interessiert sind, mit Formen interagieren ...