Die Größe des body
-Elements, die die CSS-Regeln festlegen, ist die Mindestgröße. Das body
-Element füllt immer das ganze Fenster aus. Breite und Höhe werden, falls nötig, unabhängig von einander auf die Maße des Fensters vergrößert.
Das Einzelbild-Feld ist absolut positioniert und füllt, wenn es angezeigt wird, das ganze Fenster. Das Hilfe-Fragezeichen (ID btn_help
) wird absolut in der Ecke rechts oben positioniert. Außer den Popup-Fenstern sind die übrigen Elemente automatisch positioniert.
Die Übersicht besteht aus der Überschrift (h1
-Element), dem Abschnitt mit den Vorschaubildern (ID div_details
) und der Übersicht über die Bildergeschichten (ID div_urls
).
Die gesamte Übersicht, der Vorschaubild-Abschnitt und die Übersicht über die Bildergeschichten werden alle mit einer senkrechten Bildlaufleiste angezeigt, falls nötig.
Der Vorschaubild-Abschnitt enthält zu jeder Bildergeschichte einen Unterabschnitt. Es wird immer nur der Unterabschnitt zu der ausgewählten Bildergeschichte angezeigt. Jedes Bild (das für die Sitemap ausgewählt wurde) wird durch ein div
-Element (class
inlimg
) vertreten, in dessen Hintergrund das Bild erscheint. Nach den Bildern folgt ein weiteres div
-Element (class
inllinks
) mit einem Verweis (a
-Element) zur Bildergeschichte und einem Verweis zur Galerie-Ansicht der Bildergeschichte. Alle diese "inneren" div
-Elemente werden "inline" dargestellt.
Die Übersicht über die Bildergeschichten (ID div_urls
) enthält zu jeder Bildergeschichte ein div
-Element, (class
story
), das "inline" dargestellt wird. Jedes dieser div
-Elemente enthält das repräsentierende Bild als Verweis auf die Bildergeschichte und ein verschachteltes div
-Element (class
inl
) mit einem Knopf (button
-Element), der die Bildergeschichte auswählt, und einem Verweis auf die Galerie-Ansicht der Bildergeschichte.
Das Einzelbild-Feld wird ohne Bildlaufleisten dargestellt. Die Wörter black
und grey
im Attribut class
bestimmen die Hintergrundfarbe.
Das Bild wird immer zentriert. Es wird entweder in seiner normalen Pixel-Größe angezeigt oder an die verfügbare Breite oder Höhe angepasst.
Die Aufklapp-Fenster sind durch das Wort popup
im Attribut class
gekennzeichnet. Sie werden dünn umrandet mit einem farbigen Hintergrund dargestellt. Die Wörter popact
und popinact
schalten die Sichtbarkeit der Fenster.
Aufklapp-Fenster haben einen definierten Innenabstand. Ein zusätzlicher oberer Außenabstand der Überschrift im Fenster "Tastatur-Steuerung" (h3
) würde stören.
Das "Info-Fenster" (ID about_frame
) hat eine feste Breite.