Neue Antwort schreiben 
 
Themabewertung:
  • 0 Bewertung(en) - 0 im Durchschnitt
  • 1
  • 2
  • 3
  • 4
  • 5
Hintergrundbild einblenden
freaked Offline
× ∫яεαкεδ εησυġн × ζιgнтѕтαя ×

Beiträge: 17.046
Registriert seit: Jul 2008
Beitrag #1
Hintergrundbild einblenden
hellou...gibt es denn eine allgemein hin verträgliche möglichkeit ein hintergrundbild (body background), sofern es fertig geladen/gecached wurde per fade-effekt einzublenden, und falls nicht unterstützt normal eingeblendet wird?

03.04.2011 17:45
Webseite des Benutzers besuchen Alle Beiträge dieses Benutzers finden Diese Nachricht in einer Antwort zitieren
gandro Offline
Quälgeist

Beiträge: 8.950
Registriert seit: Jul 2008
Beitrag #2
Hintergrundbild einblenden
Im Grunde sind das hier zwei Probleme:

1. Ein Bild im Vorhinein zu Laden und erst nach dem kompletten Download anzeigen.
2. Ein Hintergrundbild einfaden.

Das erste Problem lässt sich relativ elegant und einfach lösen, hier ein Stück Code was mit jedem Browser seit IE5 oder so funktionieren sollte:
Code:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
       "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Beschreibung der Seite</title>
</head>
<body>
<script type="text/javascript">
var background = "http://photojournal.jpl.nasa.gov/jpeg/PIA08653.jpg"

var imageLoader = new Image();
imageLoader.src = background;
imageLoader.onload = function () {
    // der Code hier wird ausgeführt wenn das Bild fertig geladen ist.
    document.body.style.backgroundImage = 'url(' + background + ')';
};
</script>
<!-- Fallback für Nicht-Javascripter -->
<noscript><style type="text/css">
body { background-image: url(http://photojournal.jpl.nasa.gov/jpeg/PIA08653.jpg); }
<style></noscript>

</body>
</html>

Nen Hintergrundbild einzufaden hingegen ist einiges schwieriger. Du findest zwar viele Lösungen im Netz (z.B. hier), sind aber alle Scheisse und ein Gefrickel, weil CSS das nicht kann und man mit irgendwelchen Hilfs-DIVs arbeiten muss.

Falls du eine brauchbare Lösung findest, solltest du sie problemlos in obiges Script einbinden können.
03.04.2011 23:58
Alle Beiträge dieses Benutzers finden Diese Nachricht in einer Antwort zitieren
Neue Antwort schreiben 


Gehe zu:


Benutzer, die gerade dieses Thema anschauen: 1 Gast/Gäste