Sehr einfache Möglichkeit, Bilder vorzuladen, die später benötigt werden (z. B. beim Hovern)
$.preloadImages = function() {
for (var i = 0; i < arguments.length; i++) {
$("<img />").attr("src", arguments[i]);
}
}
$.preloadImages("hoverimage1.jpg","hoverimage2.jpg");
Chris – diese Bibliothek ist fantastisch – sowohl inhaltlich als auch organisatorisch!
Vielen, vielen Dank!
Vielen Dank, Chris, genau das, was ich brauchte. Habe es heute endlich implementiert. Schauen Sie sich die verlinkte Seite an, um zu sehen, wie ich es verwendet habe. Mein erstes vollständiges Projekt, also ist vieles falsch, aber ich habe viel gelernt und neuere Projekte waren deswegen viel besser.
Es gibt einen Fall für jQuery, aber es ist nicht nötig, preloadImages an den $ Namespace anzuhängen. Semantisch finde ich, dass es als eigene Funktion belassen werden sollte.
Was mache ich, wenn ich Bilder in einem Ordner vorladen möchte? Zum Beispiel auf meiner Seite habe ich alle meine Bilder in einem Ordner namens images und die Bilder, die ich vorladen möchte, in einem Ordner namens nav. Wie kann ich diese ansprechen?
Mache ich das einfach so?
$.preloadImages("images/nav/1.jpg","images/nav/2.jpg")Vielen Dank,
Micky
Ich habe die gleiche Frage. Gibt es irgendwo eine Antwort?
Das ist alles, was ich bekomme.
ReferenceError: Can’t find variable: $
Das ist genau das, was Sie tun müssen.
Wenn jedoch der Pfad zu allen Bilddateien derselbe ist, ist es besser, ihn in die Funktion einzubeziehen, anstatt ihn für jedes Bild in der Argumentliste zu schreiben. Dasselbe gilt für die Dateierweiterung. Sie können also nur mit
$.preloadImages("1,2");Wenn alle Bilder im selben Ordner sind, einfach
$("").attr("src", "images/nav/".arguments[i]);Lance: Wenn Sie JavaScript für das Web programmieren und nicht wissen, was '$' ist, fragen Sie sich, ob Sie nicht vielleicht ein Buch über Frontend-Webentwicklung für Anfänger lesen sollten. '$' wird von jQuery bereitgestellt – einer extrem allgegenwärtigen Bibliothek. Hoffentlich haben Sie das in den 3 Jahren seit Ihrem Beitrag gelernt.
Gut gemacht, QS. Schlag drauf, schlag richtig gut drauf.
Danke Chris,
Das ist wirklich hilfreich, genau das, was ich gesucht habe.
Rob.
Danke für den Beitrag. Für Leute, die Ihre Seite als die ultimative Referenz für alles rund um HTML/CSS nutzen, könnten Sie diesen Beitrag vielleicht überarbeiten, um auch den Cache-Support für Bilder in Internet Explorer sowie die sequentielle Ladung zu integrieren. Eine ordentliche jQuery-Plugin-Architektur wäre auch wirklich großartig.
Nochmals vielen Dank für Ihre ganze Arbeit/Einblicke.
-jase
Ich glaube, Sie möchten if(document.image) prüfen und dann Bilder mit „new Image(imageSourceName)“ erstellen. Schauen Sie sich auch http://docs.jquery.com/Plugins/Authoring an… jedenfalls, cooler Blog!
So einfach! Ich liebe es! Danke :) :) :)
Ich bekomme einen JavaScript-Fehler im MSIE, der besagt: „„$“ ist undefiniert“ in der 2. Zeile des Codes
Fehlt mir etwas?
jQuery einbinden…
funktioniert das auch für Hintergrundbilder?
Wie würde ich das Skript ändern, um BG-Bilder vorzuladen, bitte.
Vielen Dank
@tim, es funktioniert genauso für Hintergrundbilder. Sie müssen nur den Bildlink in die Liste der vorzuladenden Bilder einfügen
$.preloadImages(“hoverimage1.jpg”,”hoverimage2.jpg”,”backgroundimage1.png”,”backgroundimage2.png”);
Das ist genau das, was ich brauchte!
Man kann gut argumentieren, dass das Vorladen von allem in einer schnellen Schleife nicht immer die beste Option ist
http://www.photo-mark.com/notes/image-preloading/
Der Vorschlag, eine einfachere Funktionsversion zu verwenden, wenn alle Bilder im selben Ordner sind (von ‚Knows Everything‘ vom 26. NOV. 2014), funktioniert – aber mit ‚+‘ anstelle von ‚.‘ – wie folgt
Wie wäre es mit url(‘“); was ist das Skript dafür? Können Sie mir helfen, danke :)
Einfach und funktional! Danke! =)