nicht angemeldet
AJAX - Bilder preloaden
Hallo Zusammen,
folgende Problemstellung:
Ich realisiere eine Art Slideshow mit automatischem Bilderwechsel.
Nun möchte ich das Bild welches als nächstes eingeblendet werden soll per XMLHttpRequest empfangen und dann anzeigen.
----
Mein Ansatz:
Eine Receive-Methode in der ich den ReadyState und Status abfrage.
Diese besagen "4" für DONE und "200" für OK.
Leider ist das Bild zu diesem Zeitpunkt noch gar nicht vollständig geladen, lediglich der Response Header wurde empfangen...
Wie Frage ich ab, ob das Bild tatsächlich schon vollständig geladen wurde?
function BilderVorladen(number) {
if(number < bild_array.length) {
/* Create http request variable */
var http_request = __IS_x_createHTTPRequestObject();
/* Set receive function */
http_request.onreadystatechange = function() {
receivePreloadImage(http_request, number, bild_array[number]);
};
/* Do http request */
http_request.open('GET', bild_array[number], true);
http_request.send(null);
}
}
function receivePreloadImage(http_request, number, image_name) {
/* Check ready state */
if (http_request.readyState == 4 && http_request.status == 200) {
if(document.images) {
MOTION_IMAGES[image_name] = new Image();
MOTION_IMAGES[image_name].src = image_name;
}
// Preload next image
BilderVorladen(number + 1);
}
}
Grüße,
Bene
-
Moin!
Ich realisiere eine Art Slideshow mit automatischem Bilderwechsel.
Nun möchte ich das Bild welches als nächstes eingeblendet werden soll per XMLHttpRequest empfangen und dann anzeigen.
Warum XMLHttpRequest? Javascript bietet doch schon seit Urzeiten und lange vor AJAX dafür die klassischen, bekannten (und in SELFHTML beschriebenen) Möglichkeiten an.
- Sven Rautenberg
--
"Love your nation - respect the others."-
Moin!
Ich realisiere eine Art Slideshow mit automatischem Bilderwechsel.
Nun möchte ich das Bild welches als nächstes eingeblendet werden soll per XMLHttpRequest empfangen und dann anzeigen.
Warum XMLHttpRequest? Javascript bietet doch schon seit Urzeiten und lange vor AJAX dafür die klassischen, bekannten (und in SELFHTML beschriebenen) Möglichkeiten an.
- Sven Rautenberg
Das Problem liegt hierbei darin, zu wissen wann ein Bild wirklich vollständig geladen ist.
Erst dann sollen weitere Abläufe erfolgen.
---
Die Preloader per "new Image()" und "src" haben das Problem, dass immer alle Bilder zeitgleich geladen werden.
Ich möchte gerne einen Preloader haben, der ein Bild nach dem anderen einlädt.
Gruß Bene
-
Dann erstelle die Image Objekte mit der jeweiligen Source URI eben erst dann, wenn sie gebraucht werden, und zum überprüfen, wann ein Bild tatsächlich fertig geladen ist, gibt es den onload Event Handler.
Gruß!
-
-
Habe jetzt eine einfache Lösung gefunden.
Es gibt für Image Objekte das Attribut "complete" solange dieses auf "false" steht ist das Bild noch nicht vollständig geladen.
Gruß Bene