Image Lightboxing respektiert keine manuelle Größenänderung oder [grid] Tags

Priorität/Schweregrad: Niedrig.
Plattform: Bestätigt in Firefox 127.0 unter Windows 10 und Chrome 125.0.6422.165 unter Android 14.
Beschreibung: Siehe unten.
Reproduzierbare Schritte: Laden Sie ein Bild mit einer Auflösung von 690 × 500 Pixeln oder niedriger hoch und passen Sie es entweder manuell an (z. B. ![|336x456,x150](upload://uoNNF6SaHfaM6bRapNRZoeKQqjU.png)) oder fügen Sie es in ein [grid] ein (z. B. [grid] ![|336x456](upload://uoNNF6SaHfaM6bRapNRZoeKQqjU.png) [/grid]).


Erwartetes Verhalten

Das Lightboxing in Discourse soll so funktionieren, dass, wenn das Bild verkleinert wurde, um in den Beitrag zu passen, es in einem Lightbox-Fenster angezeigt wird, damit es angeklickt werden kann, um die volle Auflösung zu sehen.

Das Problem

Es gibt einen Fehler in der aktuellen Implementierung: Es wird nur die ursprüngliche Auflösung des Bildes mit den Einstellungen „maximale Bildbreite“ und „maximale Bildhöhe“ der Website (standardmäßig 690 × 500 Pixel) verglichen, wobei die manuelle Größenänderung und Bildraster ignoriert werden. Dies hat zur Folge, dass Bilder, die verkleinert wurden, möglicherweise nicht in einem Lightbox-Fenster angezeigt werden, wenn sie unter [maximale Bildbreite]×[maximale Bildhöhe] liegen.

Manuelle Größenänderung[1]

Hier ist ein Beispiel dafür, dass das Lightboxing fehlschlägt, wenn Bilder manuell verkleinert wurden – fahren Sie mit der Maus über die folgenden Bilder, und Sie werden sehen, dass sie inkonsistent in Lightboxen angezeigt werden; klicken Sie auf ein Bild in einer Lightbox, und Sie werden sehen, dass einige von ihnen nicht erscheinen, wenn Sie links oder rechts drücken:[2]

Bildraster

Das Problem bei Bildrastern ist, dass Raster die Bilder praktisch immer verkleinern – und oft sogar beschneiden –, was ein Problem darstellt, wenn sie dann nicht angeklickt werden können, um das vollständige Bild zu sehen.

Die Lösung

Eine aktualisierte Lösungsvorschlag finden Sie in der untenstehenden Diskussion.

Die ursprünglich vorgeschlagene Lösung… Die Lösung wäre, sicherzustellen, dass:
  1. Das Lightboxing die Größe des Bildes auf der Seite mit seiner ursprünglichen Auflösung vergleicht und dass
  2. Bilder in Rastern immer in Lightboxen angezeigt werden.

Soweit ich weiß, erfolgt die Anwendung der Lightboxen clientseitig, daher glaube ich nicht, dass es zumindest prohibitiv schwierig sein sollte!


  1. Dieser Teil des Problems wurde bereits im Forum erwähnt, ein Thread, in dem mehr oder weniger die gleiche Schlussfolgerung für die Lösung gezogen wurde. ↩︎

  2. Ursprünglich verursachte dies erhebliche Formatierungsprobleme aufgrund eines Problems, das ich separat gemeldet habe, aber zum Zeitpunkt der Bearbeitung dieses Beitrags und des Schreibens dieses Teils wurde es bereits behoben. ↩︎

6 „Gefällt mir“

Ein Gedanke, den ich hatte, war dieser: Gibt es einen Grund, nicht alle Bilder in Lightboxen anzuzeigen? Zumindest Bilder, die bequem in die Infoleiste und das kleine „Erweitern“-Symbol auf Mobilgeräten passen, ohne zu viel vom Bild zu verdecken. Die Lightbox hat über die reine Anzeige des hochauflösenden Bildes hinaus zwei Vorteile:

  • Sie zeigt den Alternativtext an (was weitaus wahrscheinlicher von einem Poster geliefert wird als der Titeltext, da der Alternativtext vorausgefüllt ist und die Syntax für den Titeltext obskurer ist) und
  • Das Bild wird beim Durchblättern der Bilder nach dem Anklicken einer Lightbox nicht ausgelassen.

Gibt es einen Grund, Bilder, die vollständig angezeigt werden können, nicht in Lightboxen anzuzeigen?

Eine Option könnte sein, einfach (zusätzlich zum Lightboxing aller Bilder in Gittern) jedes Bild über einer bestimmten Größe auf der Seite in eine Lightbox zu packen – sagen wir, über 72×72 Pixel (ich denke hier an Zeilen – alles über ca. 3 Zeilen Größe). Was denkst du?

1 „Gefällt mir“

Ich stimme zu und habe dieses Problem in der Vergangenheit angesprochen, wie Sie in Ihrem OP verlinkt haben Some images don't lightbox? - #3 by piffy

Das Problem, wie ich es sehe, ist, dass die Einstellungen „skaliert und im Lightbox-Stil“ gekoppelt sind.

Idealerweise möchte ich, dass die Skalierungseinstellungen ähnlich wie diese Standardwerte von 690x500 Pixeln sind, die Lightbox-Einstellungen jedoch näher an 72x72 Pixel (wie jedes Bild, das größer als ein großes Emoji oder ein „Sticker“-großes Bild ist).

Es scheint, dass die Hauptabsicht der Lightbox darin besteht, eine unskalierte Version des Bildes anzuzeigen, aber ich verwende sie definitiv eher als Galerie im Karussell-Stil. Deshalb ist es etwas irritierend, wenn etwas 502 Pixel hohes anders behandelt wird als etwas 499 Pixel hohes, besonders wenn sie sich im selben Raster befinden.

1 „Gefällt mir“

Ich denke, das ist eine perfekte Zusammenfassung dessen, was ich mir gedacht habe – das ist der einzige Anwendungsfall, bei dem man keine Lightbox möchte, oder? Wenn das Bild entweder „Teil des Textes“ oder „Teil der Formatierung des Beitrags“ ist.

Ich denke, das ist insgesamt eine bessere Lösung – die „Lightbox-Bilder oberhalb der Größe […]“ in eine eigene Einstellung mit einem viel niedrigeren Standardwert auszulagern. Es wäre sinnvoll, wenn es sich in zwei weiteren Punkten von der aktuellen Implementierung unterscheiden würde:

  • Es sollte die Größe auf der Seite beurteilen, im Gegensatz zur Originalgröße des Bildes.
  • Es sollte wahrscheinlich beide Dimensionen überschreiten, im Gegensatz zu nur einer – ich kann mir keinen Anwendungsfall vorstellen, bei dem ein Bild, das auf der Seite z. B. 690x10 Pixel groß ist, in einer Lightbox angezeigt werden soll.

Als Anmerkung zu den Anwendungsfällen: Ich füge manchmal kleine Bilder im Emoji-Stil ein – aber sie sind hochauflösend, damit sie auf hochauflösenden Bildschirmen nicht verschwommen sind. Zum Beispiel:

! Dieses Bild sollte nicht in einer Lightbox angezeigt werden, da 1) es ein Emoticon ist, aber wichtiger, 2) das kleine Erweiterungssymbol in der unteren rechten Ecke würde den größten Teil davon auf Mobilgeräten verdecken. Derzeit wird es nicht in einer Lightbox angezeigt, da das hochauflösende Originalbild kleiner als 690x500 Pixel ist (genau 372x468 Pixel), aber es sollte trotz der Verkleinerung nicht in einer Lightbox angezeigt werden – das wirklich entscheidende Kriterium ist die Größe auf der Seite.

1 „Gefällt mir“

Bilder mit einer Auflösung von 100 x 100 Pixeln oder mehr werden jetzt per Lightbox angezeigt.

4 „Gefällt mir“