Bildershow ändern ! - Seite 1

Hallo Team,

ich arbeite auf meiner Seite, mit einer Bildershow die auch gut läuft.
Ich habe einfach mal das komplette Skript eingestellt (mit Bilder)

Ist es möglich daß ich unter jedem Bild eine Bildbeschreibung (Text)anzeigen kann?

Kann mir das jemand abändern und den kompletten Code wieder einstellen?

wäre natürlich super wenn mir jemand helfen könnte.


Hier das Skript:


<center>
<table style="width: 706px; height: 582px" border="0" cellpadding="0">
<caption>
<p><span style="font-family: Arial"><span><span style="color: #ffff00"><b>Strand Amadores</b></span></span></span></p>
</caption>
<tbody>
<tr>
<td width="100%">
<p>
<table border="5" cellspacing="1" cellpadding="1" width="200" align="center">
<tbody>
<tr>
<td><img style="width: 656px; height: 494px" name="bilder" alt="" width="700" height="500" nosave="" src="file1.npage.de/003601/82/bilder/k-dscn2536.jpg" /></td>
</tr>
</tbody>
</table>
</p>
</td>
</tr>
<tr>
<td width="100%">
<form method="post" name="rotater">
<center><script language="JavaScript1.1">
var photos=new Array()
var which=0

/* Hier die Bilder eintragen, egal wie viele es sind. Auf Unterordner achten !*/
photos[0]="file1.npage.de/003601/82/bilder/k-dscn2536.jpg"
photos[1]="file1.npage.de/003601/82/bilder/k-dscn2541.jpg"
photos[2]="file1.npage.de/003601/82/bilder/k-dscn2545.jpg"
photos[3]="file1.npage.de/003601/82/bilder/k-dscn2550.jpg"
photos[4]="file1.npage.de/003601/82/bilder/k-dscn2551.jpg"
photos[5]="file1.npage.de/003601/82/bilder/k-dscn2577.jpg"
photos[6]="file1.npage.de/003601/82/bilder/k-dscn2579.jpg"
photos[7]="file1.npage.de/003601/82/bilder/k-dscn2580.jpg"
photos[8]="file1.npage.de/003601/82/bilder/k-dscn2583.jpg"

function backward(){
if (which>0){
window.status=''
which--
document.images.bilder.src=photos[which]
}
}

function forward(){
if (which<photos.length-1){
which++
document.images.bilder.src=photos[which]
}
else window.status='Letztes Bild'
}
</script><input type="button" onClick="backward()" name="B2" value="zur&uuml;ck" />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<input type="button" onClick="forward()" name="B1" value="weiter" /></center>
</form>
</td>
</tr>
</tbody>
</table>
</center>


http://come-in.de.to

Dein Anliegen ist nicht ganz so schwer umzusetzen, ich finde das Hinleiten zu einer Lösung durch Außenstehende besser, als die direkte Lösungsvorgabe.

Als Erstes benötigst du unter dem Bild ein span-Element, wo der geänderte Infotext untergebracht wird, dieser sollte ebens durch eine ID schnell indifiziert werden können, vielleicht mit sowas wie "bildinfo".

Du hast da viele Möglichkeiten um das Problem zu lösen, du kannst jeden Eintrag als Array verwenden, wo jeweils die passenden Werte drinstehen, es würde ungefähr so aussehen:

photos[0]=new Array("file1.npage.de/003601/82/bilder/k-dscn2536.jpg","Mein InfoTag 1" )
photos[1]=new Array("file1.npage.de/003601/82/bilder/k-dscn2541.jpg","Mein InfoTag 2" )

Der Bereich wo du die Source de Bildes änderst müsst so aussehen/umbauen:
document.images.bilder.src=photos[which][0]

Die Zeile um den InfoText anzupassen kann direkt unter den Zeilen der Bildsourceänderung untergebracht werden:
document.all.bildinfo.innerHTML=photos[which][1]

Dazu gibt es auch interessante Links:
http://de.selfhtml.org/javascript/objekte/array.htm
http://de.selfhtml.org/javascript/objekte/all.htm#inner_html / Bereich innerHtml

<editiert am 24.07.11 um 14:16 von ntmb>

<editiert am 24.07.11 um 14:18 von ntmb>

Hallo Eugen,

Sorry aber ich komme damit nicht klar, ich bin in der Beziehung noch blutiger Anfänger, mir sagen die Begriffe leider nichts und ich weiß nicht wo ich was einsetzen oder löschen und einsetzen soll nichts (habe jetzt 1 St. probiert) und nichts hat geklappt
und die Links sind für mich genau so unverständlich (Sorry)
Bitte sei so gut und ändere Du mir den Code.
Das wäre wirklich super.

Liebe Grüße

Ich hab dir mal eine Lösung gemacht, wie ich es ungefähr machen würde. Der Programmcode war nicht ganz HTML-valide.

Anmerkung: Wenn du deine Fähigkeiten in JavaScript, auch ansatzweiße in HTML verbessern/optimieren würdest, würde die das ganze leichter von der Hand gehen, im Internet gibt es viele gute Anlaufstellen hierzu.

Hallo Eugen vielen DANK,

es geht wunderbar, werde mich in nächster Zeit wirklich mal um HTML kümmern,

Nochmal Danke und Liebe Grüße