• Jetzt anmelden. Es dauert nur 2 Minuten und ist kostenlos!

Bilder anzeigen

Status
Für weitere Antworten geschlossen.
DeLuXe

DeLuXe

Neues Mitglied
Hi, bin auch wieder da!!

Hab ein kleines Problem:

Ich will eine Art Slideshow machen und hab bisher folgenden Code:

Im <head>:
Code: 
<script LANGUAGE="JavaScript">
<!--

var z= 2;
Bild = new Array(z);
Bild[0] = '[img]Bilder/Dolle_29_05.jpg[/img]';
Bild[1] = '[img]Bilder/Dolle2_29_05.jpg[/img]';

//-->
</script>

und im <body>:
Code: 
<script LANGUAGE="JavaScript">
<!--
var z = 0
document.write(Bild[z]);
//-->
</script>
<input type="Button" name="rwd" value="Zurück" >
<input type="Button" name="fwd" value="Vor" >

Ich hätte jetzt gerne, dass ich auf 'Vor' klicke, und er auf 'z' eins dazurechnet (das nächste Bild soll angezeigt werden), bzw. auf 'Zurück' eins abzeiht (das vorhergehende Bild soll angezeigt werden.
Kann mir jemand helfen?
 
Werbung:
Code: 
<script type="text/javascript">function Vor()
{
   z += 1;
   if(z > Bild.lenght();)
      z = Bild.lenght();
   document.getElementById('bild').innerHTML = Bild[z]; 
}
function Zureuck()
{
   z-= 1;
   if (z < 0)
      z = 0;
   document.getElementbyId('bild').innerHTML = Bild[z];
}
</script>

dadurch wehcselst du document.write aus script tags natürlcih weglassen wenn du die schon hast.

nun musst du in den Buttons mit OnClick="" die funktionen aufrufen also OnClick="Vor();" oder OnClick="Zurueck();".

zuletzt musst du noch einen bereich zum beispiel it div deklarieren indem der quelltext des bildes eingefügt wird <div id="bild"></div>. und dann sollte es funzten.

wenn es fehler gibt schreib nochmel.

mfg Prophet
 
danke für die schnelle Antwort,

hab aber noch ein paar Probleme:

<head> unverändert
<body>:
Code: 
<script LANGUAGE="JavaScript">
<!--
var z = 0
document.write(Bild[z]);
function Vor()
{
   z += 1;
   if(z > Bild.lenght();)
      z = Bild.lenght();
   document.getElementById('bild').innerHTML = Bild[z];
}
function Zureuck()
{
   z-= 1;
   if (z < 0)
      z = 0;
   document.getElementbyId('bild').innerHTML = Bild[z];
}
//-->
</script>
<div id="bild"></div>

1. Was muss im div-Bereich anders sein?
2. Was ist sonst so falsch?
 
Werbung:
document.write(Bild[z]); <-- muss weg
var z = 0 <-- semikolion vergessen

<input type="Button" name="rwd" value="Zurück" OnClick="Zureuck();">
<input type="Button" name="fwd" value="Vor" OnClick="Vor();">
darunter setzten
 
Also irgendwie klappt das immer noch nicht

Code: 
<html>
<head>
... //Metas

<script LANGUAGE="JavaScript">
<!--

var z= 2;
Bild = new Array(z);
Bild[0] = '[img]X1.jpg[/img]';
Bild[1] = '[img]X2.jpg[/img]';

//-->
</script>

</head>

<body>

<script LANGUAGE="JavaScript">
<!--
var z = 0;
function Vor()
{
   z += 1;
   if(z > Bild.lenght();)
      z = Bild.lenght();
   document.getElementById('bild').innerHTML = Bild[z];
}
function Zureuck()
{
   z-= 1;
   if (z < 0)
      z = 0;
   document.getElementbyId('bild').innerHTML = Bild[z];
}
//-->
</script>

<div id="bild"></div>

<input type="Button" name="rwd" value="Zurück" OnClick="Zureuck();">
<input type="Button" name="fwd" value="Vor" OnClick="Vor();">

</body>
</html>
 
document.getElementbyId('bild').innerHTML = Bild[z]; <-- sorry mein fehler das b von by muss groß geschrieben werden aber dann sollte es funtzen.
 
Werbung:
hmm... klappt noch immer nicht. Der findet (vllt nicht nur) in der Zeile mit den beiden Buttons einen 'Fehler: Objekt erwartet'. Bis hierhin schonmal danke, aber vielleicht kannst du mir ja noch weiter helfen.

Code: 
<html>
<head>
<title>Bilder</title>
  //Metas
<link rel="stylesheet" href="Style.css" type="text/css">

<script LANGUAGE="JavaScript">
<!--
var z= 2;
Bild = new Array(z);
Bild[0] = '[img]Bilder/A1_29_05.jpg[/img]';
Bild[1] = '[img]Bilder/A2_29_05.jpg[/img]';
//-->
</script>

</head>

<body >

<script LANGUAGE="JavaScript">
<!--
var z = 0;
function Vor() {
   z += 1;
   if(z > Bild.lenght();)
      z = Bild.lenght();
   document.getElementById('bild').innerHTML = Bild[z];
   }
function Zureuck() {
   z-= 1;
   if (z < 0)
      z = 0;
   document.getElementById('bild').innerHTML = Bild[z];
   }
//-->
</script>

<div id="bild"></div>
<div align="right">
<input type="Button" name="rwd" value="Zurück" OnClick="Zureuck();">
<input type="Button" name="fwd" value="Vor" OnClick="Vor();">
</div>
</body>
</html>
 
ICh habe noch mal die gesamte seite überarbetet:
Code: 
<html>
	<head>
		<title>Bilder</title>
		<link rel="stylesheet" href="Style.css" type="text/css">
		<script type="text/javascript">
			<!--
			var z = 0;
			
			var Bild = new Array();
			Bild[0] = "<img src=\"avatar-2533.jpg\" alt=\"Bild1\" width=\"800px\" height=\"600px\" border=\"2\">";
			Bild[1] = "<img src=\"avatar-2534.jpg\" alt=\"Bild2\" width=\"800px\" height=\"600px\" border=\"2\">";
			
			function Vor() 
			{
				if(z < Bild.length-1)
					z += 1;
				document.getElementById("bild").innerHTML = Bild[z];
				document.getElementById("zaehler").innerHTML = "Bild "+(z+1)+" von "+Bild.length;
			}
			function Zurueck()
			{
				if (z > 0)
					z-= 1;
				document.getElementById("bild").innerHTML = Bild[z];
				document.getElementById("zaehler").innerHTML = "Bild "+(z+1)+" von "+Bild.length;
			}
			//-->
		</script>
	</head>
	<body OnLoad="Zurueck();">
		<div align="center">
			<input type="Button" name="rwd" value="Zurück" OnClick="Zurueck();">
			<input type="Button" name="fwd" value="Vor" OnClick="Vor();">
			<span id="zaehler"></span>
			<div id="bild"></div>
		</div>
	</body>
</html>

So muss es jetzt aussehen! und so funktioniert es auch ich habe zum testen die bildadressen umgeschrieben aber das ist ja kein problem.

Kritik an deinem stil:
-> LANGUAGE="JavaScript" <- das ist nicht gut funktioniert nämlich nur im IE solltest immer type="text/javascript" benutzen.

-> WIDTH=600 <- man sollte html befehle grundsätzlich kleinschreiben da sie sonst nicht zu xhtml kompatibel sind (der einzige nachteil aber bevor man nachher umlernen muss doch sinnvoll). ausserdem setzt man die übergabe werte IMMER in anführungszeichen "width="600px" " und schreibt die gewählte einheit dahinter (in HTML entweder px oder %).

wenn du verständnis fragen hast sach bescheid.

mfg Prophet
 
Tausend Dank an dich (krasser Typ 8) ). Klappt super. Und auch noch danke für deine Tipps. Werde sie mir merken!!

@all: Prophet kann was :D
 
Werbung:
Werbung:
Status
Für weitere Antworten geschlossen.

Neueste Beiträge

Zurück
Oben