Lightbox und komische Effekte

  • Hallo,


    ich versuche grad eine Lightbox zu implementieren und habe mich da an das Beispiel von w3schools gehalten: https://www.w3schools.com/howto/howto_js_lightbox.asp


    Mein Ziel ist es, dass ich ein Thumbnail habe, darauf klicke und dann erscheint die Lightbox, in der ich durch paar Bilder durchgehen kann. Also ein Bild auf der Webseite und mehrere Bilder, die in der Galerie angezeigt werden.


    Problem ist, das die Pfeile zum durchgehen, bereits erscheinen wenn die Lightbox noch nicht "geöffnet" ist. DIe Position der Pfeile nicht ganz passt. Der linke Pfeil zu weit rechts. Dazu bekomme ich einen schwarzen Balken angezeigt, auch wenn die LIghtBox noch nicht "geöffnet" ist.

    Öffne ich die Lightbox wird der Schwarze Hintergrund ganz links am Rand angezeigt und nicht über die volle Größe der Webseite.


    Hier mal Codepen: https://codepen.io/werdas34/pen/oRKovL?editors=1010 (Zuerst auf das VeranstaltungsIMG klicken und dann auf Weitere optionale Wahlmögllichkeiten. Da werden die ersten komischen Effekte angezeigt. Rechts, da wo Raeume draufsteht, öffnet die Lightbox).


    Ich hoffe ihr könnt mir helfen.


    mfg werdas34