Startseite › Weblogs › Stefan Rieger's blog ›

Bilder im Hintergund vorladen auch für den IE mit Prototype Old

Verfasst von Stefan Rieger am 15. August 2008 - 21:39

Ein Javascript Code - Schnipsel für den Internet Explorer um mehrere Bilder im Hintergrund zu laden. Nach dem Laden der Datei vom Webserver soll über ein Event- Observer eine Methode aufgerufen werden. Im Firefox oder Safari muss man nicht so vorgehen.

Wie so oft ist das Problem, das dem IE erst etwas im DOM bekannt sein muss, um damit Arbeiten zu können. Hier muss zusätlich drauf geachtet werden das die Zuweisung des Bildes (src) erst nach dem Observer vorgenommen wird.

function pre_load_img(obj) {

  // Bild Objekt erstellen
  // und auf die schnell an Prototype gewöhnen ;)
  newImage = $(new Image);
 
  // IE Bug es muss erst zu neue Obkjet in DOM
  $('DOM-ID').insert(newImage);
 
  // Hier nur ein kleines Beispiel
  // zur Übergabe von Danten an die show_img Methode
  new obj = Object({
    newImage: newImage,
    x: ''  // Nich das Letzte Komma vergessen , IE mag das nicht
  });
 
  // Nun den Observer der dann "show_img"
  // aufruft wenn das Bild geladen ist
  Event.observe(
    newImage,
    'load',  
    show_img.bindAsEventListener(obj)
  );
 
  // Erst mal möchten wir das Bild noch verbergen bis es geladen ist
  // Darum muss man sich dann in der show_img Methode kümmern
        newImage.hide();

  // Erst ganz am Ende die Bildquelle angeben
  image_data.newImage.src = '/images/....';
 
 
}