Mit welcher Technik zeigt Facebook Bilder?

Question

Wie wir alle gesehen haben, wenn wir auf einen Bild-Daumen in Facebook klicken, lädt es das gesamte Bild in einem Overlay. Ich war nur neugierig, um herauszufinden, was genau dieses Werkzeug ist.

Soweit ich verstehe, ist es eindeutig kein "jQuery modal" zu verwenden, um Bild anzuzeigen, wie Sie sehen können, nimmt das Overlay Bildschirm auf und Bildlaufleisten werden entsprechend der Größe des Overlays aber nicht der Seite selbst angepasst. was ist nicht im Fall von jQuery modals. Ich habe auch einige Modals wie Eric martin's Simple modal nachgeschlagen, aber kein Glück.

Kennt jemand Plugins, die diesen Facebook-ähnlichen Effekt erreichen können?

Answer 1

Ich erwarte, dass Facebook eigene clientseitige Bibliotheken geschrieben hat, um Dinge zu tun, anstatt out-of-the-box-Plugins wie jQuery modals zu verwenden.

Nur durch das Verhalten zu beobachten würde ich ihr Skript erwartet

(a), um die Größe der Witwe überprüft (wie Pop-ups werden verkleinern das Ansichtsfenster zu füllen), dann (b) prüft die Größe des Bildes selbst

... und, nachdem Platz für Kommentare und Anzeigen/etc gelassen wurde, genau herausfinden, welche Größe das enthaltende div für das Overlay festlegen soll. Das Bild selbst wird dann so skaliert, dass es in den verfügbaren Platz passt.

In Bezug auf Bildlaufleisten innerhalb der Überlagerung selbst, kann dies auf jedem Element mit einer festen Größe (d. H. Höhe/Breite) mit der css overflow: auto; erreicht werden. Jedes Blockelement mit diesem Stil zeigt Bildlaufleisten an, wenn der Inhalt größer als die Dimensionen des Elements ist.