nonno: Fancybox, problem mit der Gallerie: Zurück nicht möglich

Liebes Forum,
da ich wirklich nicht mehr weiter weiß und über die Suchmaschinen absolut nichts passendes finden konnte frage ich nun hier nach.
Ich habe in eine Website die Fancybox eingebaut um Referenzen anzuzeigen. Es gibt ein Thumbnail welches sich per mouseover ändert, beim anklicken öffnet sich dann die Fancybox. Bei einzelnen Bildern oder Gallerien mit nur 2 Bildern ist alles super (1 Thumbnail hinter dem dann vergrößert das Bild liegt oder eben noch ein weiteres). Wenn es nun aber mehr Bilder werden kann man sich, obwohl beide Pfeile permanent sichtbar sind, nur vorwärts navigieren. Kommt man dann beim letzten Bild an kann man von da nur eines zurück gehen, von diesem aber nur wieder zum letzten. Man hängt dort sozusagen fest. Ich weiß nicht woran es liegt...

Was ich möchte: Das man sich von jedem Bild aus in beide Richtungen bewegen kann. Man sieht ja schließlich auch die Pfeile...

Das ist im head der HTML:
<script type="text/javascript">
$(document).ready(function() {
/* * Examples - images */

$("a#prev01").fancybox({
'titlePosition' : 'inside'});

$("a[rel=example_group]").fancybox({
'transitionIn' : 'none',
'transitionOut' : 'none',
'titlePosition' : 'inside',
'titleFormat' : function(title, currentArray, currentIndex, currentOpts) {
return '<span id="fancybox-title-over">Image ' + (currentIndex + 1) + ' / ' + currentArray.length + (title.length ? ' &nbsp; ' + title : '') + '</span>';}});

$(document).ready(function(){
$('.fancybox').fancybox(); });
</script>

Das ist im body:
<div class="ref"><a rel="example_group" href="../ref/mes/Ref_bigC.jpg" title="......"><img src="../ref/mes/Ref_A.jpg" onmouseover="src='../ref/mes/Ref_B.jpg'" onmouseout="src='../ref/mes/Ref_A.jpg'"/></a></div>
<div class="ref"><a rel="example_group" href="../ref/mes/Ref_bigC1.jpg" title="......"></a></div>
<div class="ref"><a rel="example_group" href="../ref/mes/Ref_bigC2.jpg" title="......"></a></div>
<div class="ref"><a rel="example_group" href="../ref/mes/Ref_bigC3.jpg" title="......"></a></div>

Dann gibt es noch die von der fancybox.net runtergeladenen CSS und JS Dateien.

Kann mir da jemand weiterhelfen? Benötigt ihr noch andere Codeinfos?

  1. Hi,

    Das ist im head der HTML:

    Warum sind da insgesamt drei Aufrufe von .fancybox? Wie viele Fancyboxen willst du haben – eine, oder mehrere?

    MfG ChrisB

    --
    Autocomplete has spoiled me to a point where it happens every so often that I encounter a CAPTCHA, and I just type in the first character … and then wait for the rest of the code to be automatically suggested :/
    1. Hallo,

      also 2 brauch: der erste ist für einzelne Bilder und der 2. ist für die Gallerie (bzw. wenn es mehrere Gallerien gibt dann brauche ich auch mehrere Aufrufe, da die Gallerien sonst alle miteinander verbunden sind).
      Jetzt weiß ich nicht mehr wozu der dritte gehört...

      MfG nonno

      1. Hi,

        also 2 brauch: der erste ist für einzelne Bilder und der 2. ist für die Gallerie (bzw. wenn es mehrere Gallerien gibt dann brauche ich auch mehrere Aufrufe, da die Gallerien sonst alle miteinander verbunden sind).

        Fancybox benutzt das rel-Attribut, um zu entscheiden welche Elemente zu einer Gruppe gehören.
        Das bedeutet nicht, dass du für mehrere Gruppen die Fancybox auch x-fach initialisieren musst.

        MfG ChrisB

        --
        Autocomplete has spoiled me to a point where it happens every so often that I encounter a CAPTCHA, and I just type in the first character … and then wait for the rest of the code to be automatically suggested :/
        1. Hi,

          ah, das war mir nicht bewusst. Wenn ich dann mehrere Gruppen angeben will, wie gebe ich das an? Meine Momentane Methode war ja diesen Code einfach zu duplizieren und aus example_group, example_group2 zu machen.

          $("a[rel=example_group]").fancybox({
          'transitionIn' : 'none',
          'transitionOut' : 'none',
          'titlePosition' : 'inside',
          'titleFormat' : function(title, currentArray, currentIndex, currentOpts) {
          return '<span id="fancybox-title-over">Image ' + (currentIndex + 1) + ' / ' + currentArray.length + (title.length ? ' &nbsp; ' + title : '') + '</span>';}});

          Vielen Dank schon mal für deine bisherigen Antworten :)

          1. Hi,

            ah, das war mir nicht bewusst. Wenn ich dann mehrere Gruppen angeben will, wie gebe ich das an?

            Entweder in dem du den Selektor erweiterst ($("a[rel=example_group], a[rel=another_group]"), oder gleich ein anderes Kriterium für die Selektion aller in Frage kommenden Element nutzt (z.b. eine gemeinsame Klasse oder ein gemeinsames Vorfahren-Element).

            MfG ChrisB

            --
            Autocomplete has spoiled me to a point where it happens every so often that I encounter a CAPTCHA, and I just type in the first character … and then wait for the rest of the code to be automatically suggested :/