Image aus Gallery vergrößern

[Pit]

Hallo Rolf,

erstmal vielen Dank für Deine Hilfe und die Arbeit, die Du reingesteckt hast.

• die Klasse flexbox in gallery umbenennen (Klassen sagen, was das ist, nicht wie es aussehen soll)

Ok. Hatte mir McMurphy auch schonmal vor 2-3 Wochen so gesagt. Jetzt hab ichs umbenannt ;)

• die img korrekt attributieren (alt) - aber das hast Du bestimmt nur für den schnellen Test weggelassen

Stimmt.

• Einen Klick-Handler auf .gallery legen, der Klicks auf Figures und deren Inhalte behandelt. - Bei Klick ein Backdrop-DIV mit position:fixed;width:100vw height:100vh über die Galerie legen und das img mit max-width:100% dort hinein. Das img kann mit üblichen Techniken zentriert werden (z.B. flexbox), und du kannst den Backdrop später durch Controls für Links-/Rechts oder durch Timer-Funktionen ergänzen, die das Karussell erzeugen.

Ich habe an deinem Fiddle mal was rumgespielt... https://jsfiddle.net/wz7otxba/2/

Läuft schon recht gut und tatsächlich so, wie gewünscht. Klasse. Mir scheint, das "figcaption" wird im viewer-Fall nicht an das Image angepasst. Was mir auch aufgefallen ist: Wenn ich das JS in den head-Teil der Seite einpflegen möchte, läufts nicht. Dann bleibt die gallery-Variable "null". Ein Einfügen am Ende der seite schafft Abhilfe.

Ist es eigentlich möglich, das ganze über script type="module" in die HTML-Daei einzubinden? Damit kenne ich mich nämlich mal so ganz und gar nicht aus...

Pit