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

Bildergalerie mit JS

Status
Für weitere Antworten geschlossen.

bluemoon

Neues Mitglied
Hab leider keine Ahnung von JavaScript, bräuchte aber eine Bildergalerie...
Hab schon dieses Script:
HTML:
 <html>
<head></head>
<body>

<script type="text/javascript">
max = 300;
if (location.search.match(/bild=(\d+)/)){
num = Number(RegExp.$1);
document.write("<img src='bilder/bild"+num+".jpg'>");

if (num > 0){
document.write("<a href='zeigebild.htm?bild="+(num-1)+"'>zurück</a> ");
}
if (num < max){
document.write("<a href='zeigebild.htm?bild="+(num+1)+"'>weiter</a>");
}
}
else {
document.write("Keine Bildnummer übergeben.");
}

</script>
</body>
</html>

Jetzt meine Frage: Wie mach ich jetzt weiter damit des funzt??
thx :)

Edit - Codetags hinzugefügt, bitte demnächst daran denken (boehseronkel)
 
Zuletzt bearbeitet von einem Moderator:
Werbung:
du packst das in deine seite und hoffst, dass es tut.
wenn nicht, dann rätselst du, und wenn du kurz vor dem verzweifeln bist,
fragste nochmal hier nacht :D
 
Werbung:
hast du alles richtig gemacht, also die bilder im verzeichnis "bilder" abgespeichert?

gib uns am besten mal einen link, wenn es nicht online verfügbar ist, dann den kompletten code.

und ein script gehört in den head!
 
Mein Problem ist ja, dass das bis jetzt schon der ganze code ist...^^
Und weil ich in JS nun wirklich nicht sehr bewandert bin weiß ich auch nicht wies jetzt weitergeht =)
 
ach, du hast das selber geschrieben?
irgendwie glaub ich das nicht. für einen anfänger ist das ja schon ziemlich hoch.
außerdem muss ich dir leider sagen, dass das kein mehr reines js ist.
weil:
Code:
num = Number(RegExp.$1);
In JS werden Dollarzeichen nicht verwendet. das ist php
und
Code:
<a href='zeigebild.htm?bild="+(num-1)+"'>
das fragezeichen zwischen htm und bild weist auf php hin. javascript kann sowas nicht.

und da ich von ajax und php kaum ahnung habe, kann ich dir nicht weiterhelfen,
außer dass ich dir raten kann einfach ein fertiges galleriescript zu nehmen.
 
Werbung:
ne hab ich nich selber geschrieben...^^
hab ich das behauptet???

wo krieg ich denn so ein fertiges galeriescript?

e:// hat sich erledigt ich hab was gefunden :D
das script was ich da hatte war wohl nicht so geeignet xD

aber ich hab jetzt noch ein neues problem:
Code:
<?xml version="1.0" ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>
<title>Galerie</title>
<script type="text/javascript">
//<![CDATA[
<!--
var i=0;
function blaetter(cond)
{
var bild=new Array();
bild[0]="bild1.jpg";
bild[1]="bild2.jpg";
bild[2]="bild3.jpg";
bild[3]="bild4.jpg";
bild[4]="bild5.jpg";
if (cond) {i++;} else {i--;};
if (i<0) i=bild.length-1;
if (i>=bild.length) i=0;
document.getElementById('bild').src=bild[i];
};
//-->
//]]>
</script>
</head>

<body>
<p>
<img src="bild1.jpg" alt="" id="bild" /><br />
<br />
<a href="javascript:blaetter(false);">zur&uuml;ck</a>
<a href="javascript:blaetter(true);">weiter</a>
</p>
</body>

</html>

funzt soweit nur die bilder kommen immer in der selben größe...
das heißt manche sind dann verzerrt wie krieg ich des denn hin dass des bild in originalgröße erscheint?

so und wenn ich das jetzt in ne seite tun will wo 2 div container sind dann muss der wo die galerie sein soll doch einfach um den <p> tag drumrum oder??
und der andere div ist dann unabhängig davon...!?
 
Zuletzt bearbeitet:
@N10B: :roll: Wenn du nichts nützliches zu sagen hast, dann sag besser nichts ;) http://de.selfhtml.org/javascript/objekte/regexp.htm#dollar_1_9


@topic: Wieso benutzt du keinen PHP-Code?


Wenn du unbedgint JS benutzen willst, dann musst du folgendes beachten:

  1. Am ende der URL muss stehen ?bild= und dann eine Bildnummer
  2. die Bilder müsste im Ordner bilder sein, und aus dem wort "bild" und einer Nummer aufgebaut sein (die Nummer steht dabei am Ende der URL)
  3. Die gesamte Anzahl der Bilder musst du in der Variable "anzahl" angeben
  4. Die Datei mit dem Bild muss "zeigebild.htm" heißen.

Zumindest wenn ich mir den Code ansehe. Wenn ich das mit den Regex allerdings überprüfe, dann funktioniert gar nix...


Hast du viele oder wenige bilder?

Wenns wenige sind, dann knanste mein Script verwenden:

HTML:
<?xml version="1.0" encoding="ISO-8859-1" ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
<head>
<title>Bildergalerie mit JavaScript</title>
<script type="text/javascript">
<!--
var bild = new Array();
bild[0] = "Bilder/tux6.jpg";
bild[1] = "Bilder/willkommen.png";
bild[2] = "Bilder/willkommen-hell.jpg";
bild[3] = "Bilder/blue.png";
var ordner = "../";
		//usw, hier bitte alle Bilder reinschreiben.
var a = 0;
function wechsel(b){
var lay = document.getElementById('bild');
var bilder = lay.src;
for (a = 0 ; a < bild.length ; a++){
var laenge = bilder.length;
var bilder_name = bilder.substring(bilder.length - bild[a].length , bilder.length)
if (bilder_name == bild[a]){
if (a == bild.length-1 && b == 1){
a = -1;
}
if(a == 0 && b == -1){
a = bild.length;
}
lay.src = ordner + bild[a+b];
break;
}
}
}
-->
</script>
</head>
<body>
<noscript>
<p>Ihr Browser unterstützt leider kein JavaScript, daher kann die bildergalerie nicht angezeigt werden.</p>
</noscript> 
<div>
<input type="button" onclick="wechsel(1)" value="vor" style="width:55px;" />
<input type="button" onclick="wechsel(-1)" value="zur&uuml;ck" style="width:55px;" /><br />
<img src="../Bilder/tux6.jpg" alt="Einige bilder in einer Galerie" id="bild" />
</div>
<div style="position:absolute; bottom:0px;">Diese Seite enth&auml;lt valides XHTML 1.0 <br />
<a href="http://validator.w3.org/check?uri=referer">
<img src="http://www.w3.org/Icons/valid-xhtml10" alt="Valid XHTML 1.0 Strict" style="border:0px; height:31px; width:88px;" /></a>
</div>
</body>
</html>
Was du machen musst:
-Wenn du in andere Ordner gehst, dann kommt das in die Variable "ordner", solange du nicht zurückgehst kannst du den Ordner auch in den Array schreiben.
-In den Array kommen alle Bildnamen.

Wenn du viele Bilder hast, und der Name einem bestimmten Muster folgt, dann lässt der Array sich auch mit einer Schleife füllen.
 
also warum ich kein php benutz:
ich find des noch komplizierter als JS^^

Und es geht inzwischen ja auch um den 2.code der ja funkioniert aber die bilder immer in der selben größe anzeigt..oder geht das mit JS nicht dass der sie in verschiedenen größen anzeigt??

Und des werden schon n paar mehr bilder, bzw. mehrere galerien mit je ca. so um die 4-8 bilder
 
Werbung:
Status
Für weitere Antworten geschlossen.
Zurück
Oben