Hintergrund-Bild (backstretch)

Eine besondere Form der Hintergrund-Bilder sind „Backstretch“-Bilder. Diese passen sich wie „normale“ Hintergrundbilder der Form Ihres übergeordneten Elements an und füllen dieses auf jeden Fall, egal, wie sich die Form verändert. Zusätzlich können Sie hier aber genauer steuern, wie sich das Bild verhält, wenn es sich anpassen muss, z.B. können Sie einen Fixpunkt im Bild bestimmen, der immer zu sehen sein wird, egal, wie das Bild zugeschnitten wird.

Beispiele

Dieses Bild liegt im Hintergrund. Es ist so eingestellt, dass der Kopf der gezeigten Person immer zu sehen ist. Im Querformat sind ggfs. die Füße nicht mehr zu sehen, im Hochformat verschwindet die Landschaft rechts und links – der definierte Fixpunkt des Bildes aber bleibt immer so nah wie möglich an der Mitte des Bildausschnitts.

Optionen & Einstellungen

Bild | picture

the picture file to be shown

Vorab laden? | preload

Ausrichtung (X) | alignx

controls the horizontal alignment of the picture when it comes to cutting
the value is given as number from 0 (left) to 1 (right). if set to 0 (left), only the right edge will be cut, and vice versa.

Ausrichtung (Y) | aligny

controls the vertical alignment of the picture when it comes to cutting

Skalierungs-Modus | scale

select the scale mode of the picture
cover: the whole container will be filled completely, the picture may get cropped
contain: the whole picture will be shown, there may be visible space around the picture.

Alt-Attribut | alt

Text | caption

the visible caption of the picture
the caption is the text to be shown with the picture (unline the invisible 'title' or 'alt' attribute).

Text (CSS-Klassen) | captionclass

the CSS textblock style to be used for the caption

Text (Position) | captionposition

select the position of the caption