CSS Galerie mit Lightbox

Hallo zusammen,

vorab hier geht es zur Demo-Galerie: http://chaosracingteam.bplaced.net/demo/test/hw-lightbox-gallery.html

bezugnehmend auf die obige Demo komme ich mit dem hinzufügen einer Lightbox-Funktion, rein basierend auf CSS nicht weiter. Die Galerie funktioniert so wie angedacht. Nun möchte ich erreichen, wenn ich z.B. auf Bild 1 klicke, daß sich eine Lightbox öffnet, den Hintergrund abdunkelt und das Bild in Originalgröße anzeigt. Beim Klick auf das Bild und/oder auf einen „Close“-Text soll sich die Lightbox wieder schliessen, sodaß die normale Galerie wieder angezeigt wird. Ein weiteres input-Tag um das img-Tag beim Bild 1 hatte mir vorgeschwebt aber leider hat es nicht funktioniert. Dann dachte ich ein a href-Tag wäre ggf. möglich, was aber auch nicht funktioniert hat. Ich komme nicht drauf was ich wo in welche Richtung abändern bzw. hinzufügen muß, damit es funktioniert. Kann mir da jemand auf die Sprünge helfen und ggf. ein Beispiel anhand der Demo zeigen?

Google, dein Freund und Helfer, führt einen beispielsweise dahin:https://www.w3schools.com/howto/howto_js_lightbox.asp

ich möchte allerdings kein Javascript nutzen, sondern die Lösung soll komplett CSS basiert sein. Also auch die Lightbox-Funktion möchte ich mit CSS realisieren.

Ich habe nochmal eine neure Version hochgeladen bei welcher ich die Lightbox-Funktion fast integriert habe. Allerdings kann ich jetzt die einzelnen Bilder nicht mehr auswählen bzw. sie wechseln nicht und bei der Lightbox ist das Bild nicht mittig zentriert. Ich muß gestehen, so richtig verstehe ich die Funktionsweise des CSS momentan nicht und ich vermute daß es wahrscheinlich auch einfacher gehen könnte als ich das gemacht habe, daher gerade schwierig für mich die richtige Lösung zu finden. Über weitere Hilfestellung würde ich mich freuen.

Geh mal davon aus, dass das was du bereits hast, alles ist, was du rein CSS-basiert umsetzen kannst.

@Mohyra: da hoffe ich das es nicht so ist. Theoretisch versuche ich einfach eine Bildgalerie und eine Lightbox miteinander zu verbinden und das nur mit CSS. Ich denke eher wenn ich die Funktionsweise des CSS besser verstehen würde, man dann ggf. auf eine passende Lösung stoßen könnte. Mit dem verstehen habe ich allerdings gerade so meine Probleme.

Gibt es denn noch jemand anderes, der Zeit und Lust hat sich das Ganze mal anzuschauen?

Das hast du ja, im Sinne der Definition, schon erfolgreich getan.