Galerie: großes Bild nicht im neuen Fenster öffnen?

[webYebby]

Hallo,

ich möchte eine Bilder Galerie anlegen, bei der das große Bild nach klicken des kleinen Vorschaubildes nicht in einem neuen Browser-Fenster und auch nicht über die Lightbox geöffent wird. Sondern direkt auf der Seite, auf der auch die Vorschaubilder sind (z.B. darüber). Geht das? Wenn ja: wie?

Würde mich sehr über Hilfe freuen.

[johannes]

Das sollte gehen.

Wenn Sie in Ihrer Seite ein iframe mit dem namen WYDetail erstellen und die Lightbox nicht installieren, sollte dieses iframe von WebYep wie das Bild-Detail-Fenster verwendet werden:

Code: Select all

<iframe name='WYDetail' width="300" height="300"></iframe>

[webYebby]

Merci johannes. Hatte es zwischenzeitlich schon anderes gelöst (Stylesheet der Lightbox geändert), aber mit dem iframe klappt noch besser.

[Max1000]

Hallo!

Also ich habe mit der Iframe Variante einige Probleme und auch Fragen:-):

- Safari hüpft in der Gegend herum, wenn das Vorschaubild angeklickt wird
- der IFrame zeigt bei großen Fotos nur den definierten Bildausschnitt - wie könnte ein Resize ausschauen?

Gibt es eine Javascript bzw. jquery-Variante einer Bildgalerie, die einfacher zu handeln ist?

Viele Grüße und Danke im voraus

Max

[Max1000]

Fast vergessen:-)

- Wie erreicht man mit der Iframe-Lösung, dass das erste Bild bei Aufruf der Seite schon vorhanden ist?

Gruß Max

[marcus]

- der IFrame zeigt bei großen Fotos nur den definierten Bildausschnitt - wie könnte ein Resize ausschauen?

Mittels JavaScript kann man die Größe eines IFrame leicht ändern. Die relevanten Attribute wären width und height:

Code: Select all

<iframe id="WYDetailIFrame" name='WYDetail' width="300" height="300"></iframe>
   :
   :
<script type="text/javascript">//<![CDATA[
  var f = document.getElementById('WYDetailIFrame');
  f.width = 800;
  f.height = 600;
//]]></script>

Das Problem an dieser Variante ist halt, dass man sich selbst um die Größenänderung kümmern muss.

Gibt es eine Javascript bzw. jquery-Variante einer Bildgalerie, die einfacher zu handeln ist?

Hier gibt es mehrere fertige Lösungen und 2 sehr beliebte und weit verbreitete werden von WebYep unterstützt:

1. Lightbox, basierend auf Prototype und Scriptaculous und
2. FancyBox, welche jQuery verwendet // Edith sagt, dass das natürlich erst mit 1.6 möglich sein wird

Beide kümmern sich automatisch um die Größe der Anzeige, unterstützen animierte Übergänge, erzeugen automatisch Gallerien und vieles mehr.
Wenn Sie eine dieser Bibliotheken herunterladen und im "opt"-Ordner von WebYep installieren, werden das Bild- und das Gallerie-Element automatisch diese Bibliothek verwenden. Anstatt ein Popup-Fenster zu öffnen, wenn auf ein Vorschaubild geklickt wird, wird WebYep dann das Originalbild direkt in der Seite mit dem Lightbox- bzw. FancyBox-Effekt anzeigen.

[Max1000]

Hallo Marcus!

Danke für die Antwort.

Ich kann das aber nicht bestätigen. Ich habe die FancyBox in den opt-Ordner gelegt und es passiert rein garnix.

Gruß vom Max

[Max1000]

Ich weiß - ich bin hartnäckig. Aber die FancyBox (von der ich gar nicht wusste, dass sie in webyep läuft) und auch die Lightbox interessieren mich nicht - also mit der Verdunkelung und dem Geslide.
Ich finde das mit den Thumbs und dem Iframe prima - wie es einst Johannes vorgeschlagen hatte.
Es muss doch aber möglich sein, dass das erste Bild gleich beim Laden der betreffenden Seite zu sehen ist. Welche
Variable ist denn dafür zuständig? Dann würde ich mal versuchen ein script zu schreiben mit onload oder sowas.

Grüße

Max

[Max1000]

Zur LightBox: Funktioniert bei mir. Aber wie erreicht man, dass das erste Bild von anfang an zu sehen ist???

Grüße

Max

[piper]

Zur LightBox: Funktioniert bei mir. Aber wie erreicht man, dass das erste Bild von anfang an zu sehen ist???

Vielen Dank für die Lösung per iframe.
Max1000, hast du für das Problem „anzeigen des ersten Bildes“ eine Lösung gefunden?

[marcus]

Eine Beispiellösung gibt es hier.