Bilderbuchbeispiel -> erstes Foto ändern

[Christof]

Hallo,

ich habe das Bilderbuch auf http://selfhtml.teamone.de/dhtml/beispiele/bilderbuch.htm
als Vorlage genommen und möchte folgendes wissen:

Gibt es eine Möglichkeit, das Bild, das als erstes angezeigt wird, "dynamisch" festzulegen? Mir schwebt da eine Art Thumbnail-Übersicht vor, und je nachdem, auf welches Bild der Benutzer klickt, kommt das das og. Bilderbuch, und zeigt das entsprechende Bild.

Es soll also nicht immer Bild[0] als erstes angezeigt werden, sondern irgendwie (?) soll im JavaScript festgestellt werden können, auf welches Bild in der Thumbnail-Gallerie geklickt wurde.

Kann man dem Link beim Thumbnail vielleicht irgendwelche Parameter mitgeben, die dann JavaScript lesen kann?

Gruß
Christof

[XaraX]

Hallo Christof,

so richtig schlau bin ich nicht geworden, was Du jetzt konzipieren möchtest. Das erste Bild soll dynamisch geändert werden (wenn ich das richtig verstanden habe) unten habe ich Dir mal eine Möglichkeit zusammengeschustert, wie sich das Bild permanent nach 3 sec ändert. Je nach dem, ob es bei jedem Seitenabruf ein anderes Bild per Zufall sein soll, kannst Du auch die Zuordnung der src aus der unten angegebenen Funktion "Animation" ausgliedern und sie beim Seitenaufbau über document.write und randum() oder einer eigenen Funktion aus dem u. g. Array "b" holen.

Wenn es ein Laufband sein soll, arbeite am besten mit einem layer -- aber das ist schierig und am besten von Deinen Vorbildseiten abzukopieren ;)

======
<a id="bilderbuch" href="~.htm" target="~"><img id="bild" src="imgages/07.gif" border=0></a>

<script><!--
 var b = new Array();
 b[0] = new Image(); b[0].src = "00.gif";
 b[1] = new Image(); b[1].src = "01.gif";
 b[2] = new Image(); b[2].src = "02.gif";
 b[3] = new Image(); b[3].src = "03.gif";
 b[4] = new Image(); b[4].src = "04.gif";
 b[5] = new Image(); b[5].src = "05.gif";
 b[6] = new Image(); b[6].src = "06.gif";
 b[7] = new Image(); b[7].src = "07.gif";

var l = new Array();
 l[0] = "link0";
 l[1] = "link1";
 l[2] = "link2";
 l[3] = "link3";
 l[4] = "link4";
 l[5] = "link5";
 l[6] = "link6";
 l[7] = "link7";

var i = 0;

function Animation()
  {
  if(i > 7) i = 0;
  document.getElementById("bild").src = b[i].src;
  document.getElementById("bilderbuch").href = l[i];
  i = i + 1;
  window.setTimeout("Animation()",3000);
  }
 window.setTimeout("Animation()",3000);
 //--></script>

Gruß aus Berlin!
eddi

[Christof]

Hi Eddi,

erstmal Danke für deine Bemühungen, die Animation sieht witzig aus - jedoch war das nicht das was ich eigentlich wissen wollte. Ich versuchs nochmal etwas unmissverständlicher zu erklären:

Das Bilderbuch, um das es geht, soll von einer anderen HTML Seite über einen Link aufgerufen werden.

Dabei wird eben in dieser "Aufrufer-Seite" ein Thumbnail eines Bildes (let's say Bild1) angeklickt, worauf sich das Bilderbuch mit genau diesem Bild1 öffnen soll.

Mein Problem dabei ist, dass ich nicht weiss, wie ich dem Bilderbuch die Information mitgeben kann, von welcher Stelle aus es aufgerufen wurde - dh. wie der Index des ersten anzuzeigenden Bildes lautet.

Ich möchte also dem Script im Bilderbuch irgendwie von aussen einen Parameter mitgeben können, der ihm sagt, an welcher Stelle im BildArray die Slideshow beginnen soll.

Keine Ahnung ob (und wie) das überhaupt möglich ist...

[XaraX]

Moin Christof!

Ja; es gibt da eine Möglichkeit:

"Aufrufer-Seite"

<a id="bilderbuch" href="~.htm?bild_nr_3.jpg" target="~">~Thumbnail~</a>

================
"Bilderbuch"

var st = window.location.href;
var bild_da = st.indexOf("?");

if (bild_da > 0) {
       st=st.substr(st.indexOf('?')+1,st.length-st.indexOf('?')-1);
       self.Hauptframe.location.href = st;
 }
document.getElementById("bild").src = st;

Gruß aus Berlin!
eddi

[XaraX]

Moin Christof!

Ja; es gibt da eine Möglichkeit:

"Aufrufer-Seite"

<a href="~.htm?bild_nr_3.jpg" target="~">~Thumbnail~</a>

================
"Bilderbuch"

var st = window.location.href;
var bild_da = st.indexOf("?");

if (bild_da > 0) {
       st=st.substr(st.indexOf('?')+1,st.length-st.indexOf('?')-1);
 }

document.getElementById("bild").src = st;

Wie immer habe ich wieder Fehler über Fehler zusammengebaut CHEF ICH WILL ENDLICH HITZEFREI :_(

Sollte jetzt aber stimmen

Gruß aus Berlin!
eddi

Gruß aus Berlin!
eddi

[Christof]

Danke Leute, genau sowas hab' ich gesucht!!!

Gruß aus Basel
Christof

[Ingo]

Hi Christof,

Ich möchte also dem Script im Bilderbuch irgendwie von aussen einen Parameter mitgeben können, der ihm sagt, an welcher Stelle im BildArray die Slideshow beginnen soll.

Eine Möglichkeit hat Eddi ja schon aufgezeigt. Allerdings solltest Du bedenken, daß die Methode über ein Array bei zu vielen und/oder großen Bildern sehr lange Vor-Ladezeiten verursacht.
Bei umfangreichen Diashows verwende ich daher keine Arrays; sieht dann z.B. so aus:
http://www.1ngo.de/foto/dionysos.html

freundliche Grüße
Ingo