[Erledigt] Bildvorschau mittig im Browser

[Enigma228]

Ich habe mir eine HTML Seite erstellt, in der lauter Vorschaubilder sind
Bei einem Klick auf die Vorschaubilder soll mittig im Screen/Fenster (nicht mittig in der Seite) das Bild in originalgrösse erscheinen und wenn möglich der "Hintergrund" inaktiv gesetzt wird, solange das Bild nicht geschlossen wird..

Bis jetzt habe ich es über CSS und Javascript versucht in dem ich ein <div>-Layer freigehalten habe und dort einen weiteren <div>-Layer bei Klick auf Vorschaubild mit "innerhtml" eingefügt habe.

Ich habe von einem screen-Objekt gelesen, aber ich weiss nicht wie ich das Bild wie gewünscht positionieren kann..
CSS Code für den einzufügenden layer:

#popup {
  background-color: rgb(255,221,246);
  position:	absolute;
  top: 50%;
  left: 50%;
  margin-top:	-150px;  /* == halbe Höhe. */
  margin-left:	-250px; /* == halbe Breite.     */
  border: 1px solid gray;
}

mit javascript erstelle ich lediglich die <img>

GIBT ES EIN GUTES TUTORIAL DAFÜR???
Und wie lege ich den Rest der Seite inaktiv??

[nikosch]

Imho nutzt Lightbox aber auch die Browsermitte, nicht die Screengröße.

[Enigma228]

Danke

Lightbox JS

das habe ich gesucht!!

DANKE

[ChrisB]

Das macht jedes handelsübliche Lightbox-Script, das du im www findest.
Also schau dir eins davon an, wie es arbeitet. Oder setze gleich ein fertiges solches ein, wenn deine Kenntnisse über JS und CSS noch nicht ausreichen, um es selber zu implementieren.