Fullscreen Background mit JQuery

Fullscreen Backgrounds werden mit schnelleren Internetverbindungen immer häufiger.
Hierzu gibt es reine CSS Lösungen oder Lösungen die das Ganze mit Hilfe von JavaScript etwas optimieren.

Meine derzeitig favorisierte Lösung ist das jQuery Plugin BackStretch.

Das Plugin skaliert ein beliebiges Bild auf die Größe der gesamten Hintergrundfläche und passt es automatisch auf die Fenstergröße an, sobald sich diese ändert.  Die Bilder werden erst geholt, nachdem die gesamte Seite geladen wurde. Somit müssen Seitenbesucher nicht warten bis die oft sehr großen Bilder fertig geladen sind.

2 Kommentare “Fullscreen Background mit JQuery

  1. Wie gesagt, die Bilder werden erst geladen nachdem die restliche Seite geladen wurde. Dennoch sollte man die großflächigen Hintergrundgrafiken natürlich bestmöglich komprimieren und für Handys und iPads am besten ganz weglassen.

  2. Danke für den Tipp, ich hatte in einem anderen Blog grad gestern gelesen wie die Hintergrundbilder an den Rändern zu bearbeiten sind für verschieden große Monitore und Auflösungen.

    Wenn man ein großes Bild nimmt und Deinen Vorschlag, dann ist das die beste Lösung. Wie sieht es mit der Ladezeit aus?

Schreibe einen Kommentar

Deine E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind mit * markiert.