2010-12-09 10 views
4

Dies ist eine dumme Frage, da ich die richtigen Schlüsselwörter nicht finden kann, um die Antwort zu erhalten, indem ich leider Google suche.HTML/CSS "Pop-Up" -Fenster und deaktiviert Hintergrund

Sie wissen, wenn Sie auf einen Link klicken und der Hintergrund verdunkelt und unbrauchbar wird, aber der Vordergrund hat normalerweise ein Bild oder eine Login-Box? Wie die Yahoo Mail Bildanzeige Methode, wo alles im Hintergrund wird grau transparent und das Bild selbst ist in Ordnung?

Wie wird das gemacht? Und wie heißt es?

Antwort

5

es durch die Schaffung einer Überlagerung div on the fly in JS, wie getan:

var gab = document.createElement('div'); 
    gab.setAttribute('id', 'OVER'); 
    gab.innerHTML='<div class="overlay"><h1>hello</h1></div>'; 
    document.body.appendChild(gab); 

verwenden, um eine CSS-Klasse wie

#OVER{width:100%; height:100%; left:0;/*IE*/ top:0; text-align:center; z-index:5; position:fixed; background-color:#fff;} 
.overlay {width:100%; z-index:6; left:0;/*IE*/ top:30%; font-color:#cdcdcd; font-size:0.8em; text-align:center; position:fixed; background-color:#000;} 

weiß nicht, wie es heißt ..

1

Für Bilder und Sachen, die ich verwenden prettyphoto

Für Text Popup Dialog

dies alles mit der Verwendung von jquery ein Javascript

getan wird