juewi: Foto-Galerie: mit Klick auf Foto nächstes Foto

Hi!

Ich hab auf meiner Homepage zB so eine Galerie, die entweder über die Thumbnails oder mit < > bedienbar ist.

FRAGE:
Wie müsste nun ein Script aufgebaut sein, wenn ich ganz puristisch nur ein Bild anzeige und mit Klick auf dieses Bild wird das nächste angezeigt usw.

(Schön aber nicht zwingend wär dazu ein Fading auch - ich hatte sowas schon mal aber ich glaub die HTML-Datei ist futsch)

Danke euch!

Jürgen

PS: Oder wär hier statt JS eher immer eine neue HTML-Seite besser???

  1. Hi,

    Wie müsste nun ein Script aufgebaut sein, wenn ich ganz puristisch nur ein Bild anzeige und mit Klick auf dieses Bild wird das nächste angezeigt usw.

    Das Austauschen von Bildern per JavaScript zeigt beispielhaft das Anwendungsbeispiel dynamische grafische Buttons.

    Das JavaScript muss allerdings erst mal wissen, wie das "nächste" bzw. "vorherige" Bild eigentlich heisst. Das kann ihm entweder der Server mitteilen (Verzeichnis serverseitig auslesen, Liste der Bildnamen JavaScript zur Verfügung stellen); oder man nummeriert bspw. die Bildnamen durch, dann müsste dem Script nur noch mitgeteilt werden, wo "Ende" ist.

    (Schön aber nicht zwingend wär dazu ein Fading auch - ich hatte sowas schon mal aber ich glaub die HTML-Datei ist futsch)

    http://aktuell.de.selfhtml.org/artikel/javascript/fader-framework/

    PS: Oder wär hier statt JS eher immer eine neue HTML-Seite besser???

    Die sollte es sowieso geben. JavaScript kann dann ggf. darauf aufsetzen, und das ganze für den Nutzer komfortabler oder "schöner" machen, wenn gewünscht - Zitat #1643.

    MfG ChrisB

    --
    Light travels faster than sound - that's why most people appear bright until you hear them speak.
    1. Das Austauschen von Bildern per JavaScript zeigt beispielhaft das Anwendungsbeispiel dynamische grafische Buttons.
      Das JavaScript muss allerdings erst mal wissen, wie das "nächste" bzw. "vorherige" Bild eigentlich heisst. Das kann ihm entweder der Server mitteilen (Verzeichnis serverseitig auslesen, Liste der Bildnamen JavaScript zur Verfügung stellen); oder man nummeriert bspw. die Bildnamen durch, dann müsste dem Script nur noch mitgeteilt werden, wo "Ende" ist.

      Ok kann ich mir das so grob erklären dass ich mit zB onmouseclick und einer Schleife, die eine Zählvariable jeweils um 1 erhöht und die Bildquelle damit von zB start1.jpg auf start2.jpg usw. ändere???

      http://aktuell.de.selfhtml.org/artikel/javascript/fader-framework/

      Danke werd ich mir ansehen - da steht aber ne Menge...

      »» PS: Oder wär hier statt JS eher immer eine neue HTML-Seite besser???
      Die sollte es sowieso geben. JavaScript kann dann ggf. darauf aufsetzen, und das ganze für den Nutzer komfortabler oder "schöner" machen, wenn gewünscht - Zitat #1643.

      Echt starker Spruch! ;-)

  2. Meine persönliche Einstellung:
    Ein kleiner Fade-Effekt ist sicher nicht schlecht, schlimm wirds nur wenn man vergleichsweise "lange" auf ein neues Bild warten muss. Der Effekt nutzt sich dann schnell ab und nervt nur noch.
    Ganz schlecht finde ich auch wenn man ein Bild nicht in einem neuen Tab öffnen kann. Bei Javascript hinter einem Klick ist das nicht möglich.

    Ich unterscheide zwischen einer Galerie die mir zeigt was der Autor alles kann und einer die bedienbar ist ;-) Ich würde an deiner Stelle den eigentlichen Sinn nicht aus den Augen verlieren, nämlich das möglichst komfortable anschauen von Bildern und nicht das ganze drumherum, bis ein Bild mal steht.

    1. Ich unterscheide zwischen einer Galerie die mir zeigt was der Autor alles kann und einer die bedienbar ist ;-) Ich würde an deiner Stelle den eigentlichen Sinn nicht aus den Augen verlieren, nämlich das möglichst komfortable anschauen von Bildern und nicht das ganze drumherum, bis ein Bild mal steht.

      Deine Ansicht ist ok aber für viele unbedarfte User ist es am komfortabelsten und auch recht verbreitet, einfach immer auf ein Foto zu klicken um das nächste aufzurufen und sonst mit keiner weiteren Steuerung verwirrt zu werden.

      Diese Art der Präsentation sollte nur für vielleicht max. 20 Best-Of verwendet werden und genau darum gehts mir. Längere Serien werde ich weiter mit Thumbnails gestalten um dem User die Auswahl zu überlassen.

      LG, Jürgen

      1. Deine Ansicht ist ok aber für viele unbedarfte User ist es am komfortabelsten und auch recht verbreitet, einfach immer auf ein Foto zu klicken um das nächste aufzurufen und sonst mit keiner weiteren Steuerung verwirrt zu werden.

        Das finde ich auch in Ordnung. Mir gings mehr um die Art, wie das neue Bild sichtbar wird, da scheinen wir aneinander vorbei geredet zu haben.
        Man kann aufs Foto klicken und das nächste wird geladen.
        Oder man klickt aufs Foto, dann kommt erst ein Ladebalken, dann verkleinert sich das alte Bild, dann vergrößert sich das neue, macht noch furchtbar lustige Dinge usw. und irgendwann ists tatsächlich endlich mal da.

  3. Ich hab bei mir u. a. so was eingebaut:

    <script type="text/javascript">
    // Image preloader //
    var pic1=new Image();   pic1.src="images/pic1.png";
    var pic2=new Image();   pic2.src="images/pic2.png";
    var pic3=new Image();   pic3.src="images/pic3.png";
    var pic4=new Image();   pic4.src="images/pic4.png";
    var pic5=new Image();   pic5.src="images/pic5.png";
    var pic6=new Image();   pic6.src="images/pic6.png";
    var pic7=new Image();   pic7.src="images/pic7.png";
    var pic8=new Image();   pic8.src="images/pic8.png";
    var pic9=new Image();   pic9.src="images/pic9.png";
    var zahl = 1;
    function bildwechsel ()
    {zahl++
    document.images.hallo.src = "images/pic"+zahl+".png";
    if (zahl == 9)   {zahl = 0;}}
    </script>

    <!------------------------------------------>

    <img name="hallo" src="images/pic1.png" alt="" onclick="bildwechsel()">

    Vielleicht hilft dir das irgendwie weiter ?!
    Gruß Wastl