DHTML Bilderbuch zum Umblättern

[Alex]

Hallo zusammen,

ich fand hier auf selfhtml eine interessante Art der Darstellung eines dynamischen Bilderbuchs zum Umblättern.

http://de.selfhtml.org/dhtml/beispiele/bilderbuch.htm

Ich konnte das Script auch soweit meinem vorläufigen Layout anpassen.
Am Script selber habe ich nur die Größenangaben verändert, dhtml.js unverändert auf den Server geladen und die vorläufigen Bilder umbenannt.

<script type="text/javascript" src="dhtml.js"></script>  
<script type="text/javascript">  
var Bild = new Array();  
Bild[0] = new Image();  
Bild[0].src = "images/bilderbuch01.gif";  
Bild[1] = new Image();  
Bild[1].src = "images/bilderbuch02.gif";  
Bild[2] = new Image();  
Bild[2].src = "images/bilderbuch03.gif";  
Bild[3] = new Image();  
Bild[3].src = "images/bilderbuch04.gif";  
Bild[4] = new Image();  
Bild[4].src = "images/bilderbuch05.gif";  
  
var bildbereich;  
var zeige = 0;  
var Breite = 480;  
var aktuelleBreite = 0;  
var Schrittweite = 6;  
var Schrittverzoegerung = 1;  
  
function Blaettern (Richtung) {  
  zeige = zeige + Richtung;  
  if (zeige > Bild.length - 1) {  
    zeige = 0;  
  } else if (zeige < 0) {  
    zeige = Bild.length - 1;  
  }  
  if (DOM || MSIE4) {  
    bildbereich.style.clip = "rect(0 0 500px 0)";  
  } else if (NS4) {  
    bildbereich.clip.right = 0;  
  }  
  if (DOM && bildbereich.firstChild) {  
    bildbereich.firstChild.src = Bild[zeige].src;  
  } else if (MSIE4) {  
    bildbereich.innerHTML = '<img src="' + Bild[zeige].src + '">';  
  } else if (NS4) {  
    bildbereich.visibility = "hide";  
    setContent("id", "Bildbereich", null,  
      '<img src="' + Bild[zeige].src + '">');  
    bildbereich.visibility = "show";  
  }  
  BildAufbauen();  
}  
  
function BildAufbauen () {  
  if (aktuelleBreite <= Breite) {  
    if (DOM || MSIE4) {  
      bildbereich.style.clip = "rect(0 " + aktuelleBreite + "px 500px 0)";  
    } else if (NS4) {  
      bildbereich.clip.right = aktuelleBreite;  
    }  
    aktuelleBreite = aktuelleBreite + Schrittweite;  
    window.setTimeout("BildAufbauen()", Schrittverzoegerung);  
  } else {  
    aktuelleBreite = 0;  
    if (DOM || MSIE4) {  
      bildbereich.style.clip = "rect(0 " + Breite + "px 500px 0)";  
    } else if (NS4) {  
      bildbereich.clip.right = Breite;  
    }  
  }  
}  
  
function Init () {  
  bildbereich = getElement("id", "Bildbereich");  
  if (DOM && document.createElement && bildbereich.appendChild) {  
    var img = document.createElement("img");  
    img.setAttribute("src", Bild[0].src);  
    bildbereich.appendChild(img);  
  } else if (MSIE4) {  
    bildbereich.innerHTML = '<img src="' + Bild[0].src + '">';  
  } else if (NS4) {  
    setContent("id", "Bildbereich", null,  
      '<img src="' + Bild[0].src + '">');  
  }  
}  
</script>

Leider bekomme ich beim Klicken der Pfeiltasten, vorwärts wie rückwärts, immer wieder das Bild "bilderbuch01.gif" erneut geladen, und nicht die 4 weiteren Bilder :(

Hier einmal zur Ansicht:

http://alex-hache.de/littledance_5/preise.html

Wäre froh, wenn mich jemand auf meinen Fehler stoßen könnte.

Mit vielem Dank im Voraus,   Alex

[Matthias Apsel]

Om nah hoo pez nyeetz, Alex!

dieses Script ist ein Beispiel dafür, dass auch selfhtml nicht immer auf der Höhe der Zeit ist, oder hast du in den letzten Wochen was entscheidendes vom Internetexplorer 4 oder Netscape Navigator gehört?

Matthias

[Alex]

Om nah hoo pez nyeetz, Alex!

dieses Script ist ein Beispiel dafür, dass auch selfhtml nicht immer auf der Höhe der Zeit ist, oder hast du in den letzten Wochen was entscheidendes vom Internetexplorer 4 oder Netscape Navigator gehört?

Matthias

Hi Matthias,

nein, habe ich nicht.

Meine Fehlersuche verlief trotzdem ins Nichts. Das Script funktioniert, aber leider nicht im SRWare Iron....

Gruß, Alex

[Matthias Apsel]

Om nah hoo pez nyeetz, Alex!

wenn du den Validator fragst, findet der so einiges.

Das beginnt mit <?php ... ?> vor dem öffnenden html-Tag. Von deinen gefühlt 241 div-Elementen brauchst du höchstens 5.

Matthias

[Alex]

Bom dia, Matthias,

ich mag divs :D und arbeite ungern mit Tabellen.

Nach dem Auslagern des Scripts hat das W3C auch nichts mehr zu meckern, aber nichtsdestotrotz läuft der Blätter-Effekt NUR im IE :(

Schade...

Gruß,   Alex

[Matthias Apsel]

Om nah hoo pez nyeetz, Alex!

ich mag divs :D und arbeite ungern mit Tabellen.

schon klar, trotzdem reichen maximal 5 div-Elemente

Matthias

[EKKi]

Mahlzeit Alex,

ich mag divs :D und arbeite ungern mit Tabellen.

Was hat das eine mit dem anderen zu tun?

Tabellen sind für die Darstellung tabellarischer Daten. <div>-Elemente sind für das Gruppieren bzw. Zusammenfassen beliebiger zusammengehöriger Elemente.

Ansonsten sollte man für den Aufbau seiner HTML-Seiten natürlich jede Menge semantisch sinnvoller Elemente (wie z.B. <hX>, <p>, <ul> usw.) nutzen, anstatt übelriechende und -schmeckende <div>-Suppe zu köcheln.

MfG,
EKKi