Bild langsam austauschen

Status
Nicht offen für weitere Antworten.

Reimers_Web

Grünschnabel
Guten Morgen

Habe eine Bilder Galerie im www gefunden http://www.ajaxschmiede.de/demos/slideshow/

Und das Script hier:
PHP:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Test</title>
<style type="text/css">
#box1{
margin:20px auto;
width:600px;
}
#box2{
float:left;
}
#box3{
float:right;
}
</style>
<script language="javascript">

var bilder = new Array(5)

bilder [0] = "bild1.jpg";
bilder [1] = "bild2.jpg";
bilder [2] = "bild3.jpg";
bilder [3] = "bild4.jpg";
bilder [4] = "bild5.jpg";

function gros(x){
document.bild.src = bilder[x];
}

var gg =0;
function vor() {
 arrayanzahl = bilder.length;
 if (arrayanzahl >gg) {
 gg++;
 document.bild.src = bilder[gg];
}}


function zuruck() {
if (gg > 0){
gg--;
document.bild.src = bilder[gg];
}}

</script>
</head>

<body bgcolor="#CCCCCC">
<div id="box1">
<div id="box2">
<img width="400px" height="400px" src="bild1.jpg" name="bild" /><br /><br />
<center>

<button onclick="zuruck(x)">Zurück</button>&nbsp;&nbsp;&nbsp;&nbsp;
<button onclick="vor(x)">Vor</button>

</center>

</div>
<div id="box3">
<table>
<script language="javascript">
var td, tr, trzu, tdzu;
  td="<td height=\"152px\" width=\"152px\"> ";
  tr="<tr>";
  tdzu="</td>";
  trzu="</tr>";
  
for (var x=0; x<5; x++) {
document.write(tr+td+'<img onclick="gros('+ x +')" width="150px" height="150px" src="'+ bilder[x] +'">'+tdzu+trzu);
}
</script>

</table>
</div>
</div>

</body>
</html>

Wie baut man die Galerie jetzt so um,das man egal op man nach vorne drückt oder nach hinten oder rechts auf die Liste,sich die Bilder so geschmeidig wechseln?

mit freuntlichen grüßen Reimers
 
Hi,

mal andersrum gefragt, wieso verwendest du nicht einfach diese Bildergalerie, die ja funktionell genau das bietet, was du dir vorstellst?

mfg Maik
 
Wenn du die "Betriebsanleitung zur Bilder-Galerie" des Autors durchliest, und seinen genannten Links zur ursprünglichen Fassung der Slideshow, sowie den ähnlichen Themen im Blog folgst, sollte sich eigentlich der Lerneffekt von selbst einstellen.

Wenn du dann anschliessend deinen Quellcode gemäß der Anleitung mit den erforderlichen Script-Komponenten aufrüstest, die in deiner gezeigten Quellcode-Fassung gänzlich fehlen, dürfte sich auch ein "Aha"-Erlebnis einstellen - alles in allem eigentlich ganz gute Aussichten.

mfg Maik
 
Status
Nicht offen für weitere Antworten.

Neue Beiträge

Zurück