Sie sind hier: Fullsize- Elemente > Fullscreen-Bildbox
Fullscreen-Bildbox als Hintergrundbild mit Inhalt
So sieht das Bild im Original aus:
Realisierung:
Desktop: realisiert mit Seitenbox
Mobil: ursprünglich als Alternative mit der Klasse smartphone ganz oben im Inhalt. Jetzt kann dort die Seitenbox auch aktiviert werden. Hab die Alternative für Smartphone ganz unten in dieser Seite drin gelassen, weil sie theoretisch noch verwendet werden kann. Sie ist flacher als die Seitenbox-Variante.
Vorteil gegenüber Seitenkennungsbild / Handhabung:
- wird komplett mit dem ganzen Inhalt NUR in der jeweiligen Seite eingeblendet, da es nicht im Template steht, sondern im CK-Editor, Bildformat sk
- für die Mobilversion gab es keine Seitenboxen, da wurde es ganz oben in den Inhalt eingefügt (mit negativeom Margin li + re, damit das Bild optisch bis zum rand geht) - bildformat mob-skal
Beschreibung:
- Geht über die ganze Breite (Fullsize), auch wenn der Inhalt der Homepage in der Lesebreite eingeschränkt ist
- auf dem handy war es Teil des Inhaltes, da es dort keine Seitenboxen gibt, geht aber negatives Margin li + re auch bis zum Rand
- das background-image wird im CK-Editor eingefügt, wie hier zu sehen ist, mit hart eingetragener BILD ID
- Momentan wird Bildausschnitt center center eingeladen, dies kann im Css auch geändert werden
- Das Bild muss breit genug sein für das Bildformat sk. Hier wird es verzerrt, da das Originalbild nur 800 px breit ist.
Variante Fullscreen-Bildbox im Inhalt:
Mit negativem Margin links und rechts ausgerückt. Funzt mobil auch noch (Überschriftformate sind zwar mehr an der Seite, was ich aber nicht als Problem sehe)
Mustertext Zeile 1
Mustertext Zeile 2