nicht angemeldet
Div. Thumbnails, einzelne Html Datei mit grosser Bildansicht
Hallo zusammen,
Javascript-Problem:
1. Ich habe 3 einzelne Html Dateien mit Thumbnails(ca jeweils 10 kleine Bilder), nun möchte das man mit Onclick auf eine andere einzelne Html Seite springt, wo dann das ensprechend grosse Bild in einer Tabelle angezeigt wird (Die grossen Bilder haben alle die selbe Grösse).
2. Wenn man sich auf der Seite mit dem grossen Bild befindet, sollte man auch durchblättern können.
Hat mir jemand einen guten Tipp oder eine Lösung in Scriptform?
Ich möchte das ganze nicht mit Frames lösen..
Für schnelle Hilfe bin ich sehr dankbar
André
-
Hallo!
- Ich habe 3 einzelne Html Dateien mit Thumbnails(ca jeweils 10 kleine Bilder), nun möchte das man mit Onclick auf eine andere einzelne Html Seite springt, wo dann das ensprechend grosse Bild in einer Tabelle angezeigt wird (Die grossen Bilder haben alle die selbe Grösse).
- Wenn man sich auf der Seite mit dem grossen Bild befindet, sollte man auch durchblättern können.
Also: Die Html-Datei (BTW - wieso machst Du nicht für jede Grafik eine eigene Datei, damit wird alles viel einfacher???) enthält Layer, für jede Grafik einen. Alle sind unsichtbar. Du rufst die Seite dann mit einem Parameter (am Besten den Namen des entsprechenden Layers) auf und machst diesen dann sichtbar. Zum Blättern machst Du dann unterhalb der Grafiken einen Link zum Vorwärtsblättern (macht den aktuellen Layer unsichtbar und den nächsten sichtbar) und einen zum Rückwärtsblättern.
Info zur Parameterübergabe:
http://aktuell.de.selfhtml.org/artikel/javascript/wertuebergabe/index.htm
http://aktuell.de.selfhtml.org/artikel/javascript/wertuebergabe-2/index.htmZur Sichtbarkeit der Layer:
http://dhtml.seite.net/beispiele/4.htmlGruß Markus
-
Tag !
Ich hab da selber mal ein ähnliches Script entwickelt. In ein Verzeichnis ./img/thumbs kopierst Du die kleinen Bilder und in ./img/gross die grossen Bilder.
Das Script generiert die Galerie selbstständig aus den verfügbaren Bildern im Verzeichnis.
Was fehlt ist die Blätter-Funktion zwischen den großen Bildern. Sollte aber kein großes Problem darstellen, die einzubauen ;-)
(Tip: Am einfachsten wird es, wenn Du die Bilder durchnummerierst)----------------------------------------------------
<?php
if($picture=="")
{$bilder = 0;
if($start=="") $start=0;
$verzeichnis = dir("./img/thumbs");
while($datei = $verzeichnis->read())
{ if(substr($datei, strlen($datei) - 3, 3)=="jpg")
{ $bilder++;
if($bilder>=$start && $bilder<$start+10)
{ $file = substr($datei, 0, strlen($datei) - 4);
echo "<a href="./galerie.php?picture=".$file."&nr=".$bilder.""><img src="./img/thumbs/".$file.".jpg"></a>\n";
if(($bilder-$start)%3==0) echo "<br>\n";
}
}
}
if($start!=0) echo "<a href="galerie.php?start=".($start-10)."">Zurück</a>";
if($bilder>=$start+10) echo "<a href="galerie.php?start=".($start+10)."">Weiter</a>";
}
else
{ echo "<img src="./img/gross/".$picture.".jpg" alt="Bild ".$picture.".jpg"><br><br>\n"; }
?>
---------------------------------------------------Die Ausgabe des HTML-Quelltextes mußt Du halt noch an Deine Bedürfnisse anpassen.
Ciao,
Harry
-
Hallo zusammen,
Javascript-Problem:
- Ich habe 3 einzelne Html Dateien mit Thumbnails(ca jeweils 10 kleine Bilder), nun möchte das man mit Onclick auf eine andere einzelne Html Seite springt, wo dann das ensprechend grosse Bild in einer Tabelle angezeigt wird (Die grossen Bilder haben alle die selbe Grösse).
<a href="grosseseite1.html"><img src="thumb1.jpg"></a>
Und in grosseseite1.html die Tabelle einbauen wie gewünscht.
Wahlweise (geht dann nur mit Javascript) kannst du auch einen Parameter in der URL übergeben und dann nur eine Seite benutzen, die dynamisch das große Bild einbindet.
<a href="grosseseite.html?gross1.jpg"><img...></a>
Dazu liest du dann </selfhtml/javascript/objekte/location.htm#search>
- Wenn man sich auf der Seite mit dem grossen Bild befindet, sollte man auch durchblättern können.
Baue eine zentrale JS-Datei, in der du ein Array mit allen Bildnamen definierst. Dann brauchst du noch einen Button "vorwärts" und "rückwärts", die jeweils das nächste oder vorige Bild aufrufen. Diese beiden Funktionen testen, welches Bild gerade angezeigt wird (z.B. anhand der URL oder anhand des Bildes (document.imagename.src)), prüfen, wo sich das im Array befindet (alle Arrayelemente mit dem Namen vergleichen) und weiß dann, welches vorher und nachher kommt (aktueller Arrayindex +1 oder -1). Die zentrale Datei kann dann überall eingebunden werden, wo du blättern willst.
Hat mir jemand einen guten Tipp oder eine Lösung in Scriptform?
Ich möchte das ganze nicht mit Frames lösen..
Für schnelle Hilfe bin ich sehr dankbar
André
Ist zumindest ein Tipp.
- Sven Rautenberg