Guido: Bilder dynamisch wechseln - Probelm mit IE

Hallo Forum,

ich habe mir mit meinen (wenigen!) Java-Kentnissen und verschiedenen Quelltexten eine dynamische Seite für die Erzeugung von Mitgliederdetails eines Vereins geschrieben um bei einer Layoutänderung die Seiten schneller anpassen zu können. Im Prinzip eine Minidatenbank die immer auf die gleiche Seite zugreifen soll. Eine Serverseitige Sprache kann ich leider nicht verwenden, da ich die HP auf offline auf CD funktionsfähig haben möchte.

Die besagte Seite ist unter:
http://www.bsg-olfen.de/web/mitglieder.htm?1
online.

Im Firefox, bzw. Mozilla funktioniert sie Seite so wie ich will. Die Bilder sollen passend zu den Namen geladen werden. Falls noch kein Bild vorhanden (auf dem Server) ist soll die Seite stattdessen das Bild "leer.jpg" anzeigen.
In der Fkt. setdata () habe ich versucht anhand der Breite des Bildes (width==true --> Bild vorhanden) entweder auf das Bild der passenden ID - oder wenn nicht vorhanden - auf das "leer.jpg" (Array 0 --> bildervz + Daten[0]["m_bild"] +".jpg") zu verzweigen.

Im Firefox funktioniert das toll, nur im IE nicht. Der IE zeigt grundsätzlich das leere Bild - und zeigt die vorhandenen Bilder erst nach aktualisierung der Seite an. Der Eintrag wo kein Bild vorhanden ist (id = 3) läd nach aktualisierung dann nicht das leer.jpg  - sondern gar keins :-(

Hat jemand eine Idee wie ich das hinbekommen könnte?
kann man da eventuell ein timeout mit einbauen das nur das Bild nochmal aktualisiert wird wenn der IE alles geladen hat?
Und warum zeigt der IE beim dritten Bild (id=3) nach aktualisierung nicht das leer.jpg an?
Oder ist mein Ansatz komplett Falsch?

Hilfäääää!

Gruß Guido

Hier der Quelltext:

<script language="JavaScript">

//Array fuer Datencontainer definieren
    var Daten = new Array();

//Daten in das Array schreiben
    function addData (m_name,m_bild,funktion,eintritt,tel,fax,mail,web,weiteres)
    {
      Daten[Daten.length] = new Object();
      Daten[Daten.length - 1]["m_name"]       = m_name;
      Daten[Daten.length - 1]["m_bild"]       = m_bild;
      Daten[Daten.length - 1]["funktion"]     = funktion;
      Daten[Daten.length - 1]["eintritt"]     = eintritt;
      Daten[Daten.length - 1]["tel"]          = tel;
      Daten[Daten.length - 1]["fax"]          = fax;
      Daten[Daten.length - 1]["mail"]         = mail;
      Daten[Daten.length - 1]["web"]          = web;
      Daten[Daten.length - 1]["weiteres"]     = weiteres;
    }

//Endung hinter der URL abc.htm?xxx
    var anhang;

//Anhang von der URL trennen
    function extAnhang()
    {
      var URLInhalt      = location.href;
      var ArrayVariable  = URLInhalt.split("?");
      anhang             = unescape(ArrayVariable[1]);
      //Anhang in eine IntagerZahl umwandeln
      id = parseInt(anhang);

//Prüfe ob Zahl vorhanden ansonsten setze Zahl auf NULL
      if (!id) id = 1;
    }

//Funktion ausführen
    extAnhang();

//Setze Bilderverzeichnis
    var bildervz = "images/mitglieder/";

//Datencontainer füttern
    addData ("m_name","leer","funktion","eintritt","tel","fax","mail","web","weiteres");
    addData ("Albert Böcker","albertboecker","1. Vorsitzender","1988","02595 838","","albert_boecker at yahoo dot de","http://www.bsg-olfen.de","Thronoffizier");
    addData ("Christoph Krursel","christophkrursel","2. Vorsitzender","1990","","","","http://www.bsg-olfen.de","");
    addData ("Josef Kaltwasser","josefkaltwasser","1. Geschäftsführer","1990","","","","http://www.bsg-olfen.de","");
    addData ("Beate Hatebur","beatehatebur","2.Geschäftsführerin","1990","","","","http://www.bsg-olfen.de","Abteilungsleiterin der Damenabteilung");
    addData ("Josef Hatebur","josefhatebur","1. Kassierer","1977","02595 3564","","","http://www.bsg-olfen.de","");
    addData ("Everhard Maikoetter","everhardmaikoetter","2. Kassierer","1990","02595 98419","","","http://www.bsg-olfen.de","");

//addData ("Guido Schlüter","guidoschlueter","Webmaster","1990","02595 972818","02595 972819","webmnaster@bsg-olfen.de","http://www.xodiug.de","");

//Anzahl der Einträge bestimmen
    function anz ()
    {
      var anz = 0;
      for (i = 0; i < Daten.length; i++)
      anz++;
      return anz-1;
    }

//Setze Array auf id=0 wenn Anzahl überschritten wird
    if (id > anz()) id = 1;

//Lade Bild vorab, wenn breite = 0 ist das Bild nicht vorhanden
    //und wird in der setdata() durch das Bild 0 ersetzt
    var pic = new Image();
    pic.src = bildervz + Daten[id]["m_bild"] + ".jpg?"+ Math.random();

//Daten für späteren Gebrauch definieren
    function setdata (){

document.getElementById ("m_name").firstChild.data = Daten[id]["m_name"];

//Entscheidung ob Bild vorhanden ist oder nicht
      if(!pic.width == true)
        {
        document.getElementById ( "m_bild" ).src = bildervz + Daten[0]["m_bild"] +".jpg";
        }
      else {
      document.getElementById ( "m_bild" ).src = bildervz + Daten[id]["m_bild"] +".jpg";
      }

//Restliche Daten definieren
      document.getElementById ("funktion").firstChild.data = Daten[id]["funktion"];
      document.getElementById ("eintritt").firstChild.data = Daten[id]["eintritt"];
      document.getElementById ("tel").firstChild.data = Daten[id]["tel"];
      document.getElementById ("fax").firstChild.data = Daten[id]["fax"];
      document.getElementById ("mail").firstChild.data = Daten[id]["mail"];
      document.getElementById ("web").firstChild.data = Daten[id]["web"];
      document.getElementById ("weiteres").firstChild.data = Daten[id]["weiteres"];

}
function weiter(){
id += 1;
self.location.href = "mitglieder.htm?" + id;
}
</script>

<body onload="setdata ()">

  1. !pic.width == true

    Ähm. Das verstehe ich nicht ganz. das == true kannst du eigentlich weg lassen.

    Es soll ja folgendermaßen nachfragen, oder?

    Wenn pic.width nicht true

    Das ! fragt ja nach, wenn es entweder nicht vorhanden ist oder false ist. vielleicht liegt es ja daran.

    so könnte es funktionieren:

    if(!pic.width)
    ...

    MFG
    Griever

    1. !pic.width == true

      Ähm. Das verstehe ich nicht ganz. das == true kannst du eigentlich weg lassen.

      ok, hab ich, bzw, hatte ich schon probiert - der Teil ist klar...

      so könnte es funktionieren:

      if(!pic.width)

      Das Problem besteht allerdings weiterhin :-(
      Oflline klappt es manchmal - da die Ladezeiten geringer sind. Ist das ganze allerdings auf einem Server hauts wieder nicht hin.

      Weiteres Problem ist, dass der IE bei !pic.width ein true hraus gibt, da dieser dann einen platzhalter für die nicht vorhandene Grafik erstellt - und dieser eine Breite von (glaub) 30pxl hat. diese 30pxl nimmt er dann als width für die Grafik, die eigentlich gar nicht da ist.

      Habe es schon bis etwas wie if(pic.width > 100).... probiert - ist aber auch nicht 100% zuverlässig...

      Am schönsten wäre, wenn er erst die komplette Seite läd, und dann die ggf. vorhandenen Bilder austauscht... gibts da noch eine Möglichkeit???

      Greetz Guido