Ankündigung

Einklappen
Keine Ankündigung bisher.

Bildergalerie mit Popup-Fenster

Einklappen

Neue Werbung 2019

Einklappen
X
Einklappen
  • Seite von 1
  • Filter
  • Zeit
  • Anzeigen
Alles löschen
neue Beiträge
Vorherige Weiter
  • #1

    Bildergalerie mit Popup-Fenster

    Hallo,

    ich bin gerade dabei, eine Bildergalerie zu schreiben, komme aber inzwischen nicht mehr weiter.
    Ich komme bis zu dem Punkt, dass er mir alle Thumbnails aus einem bestimmten Ordner ausgibt. Nun möchte ich aber, dass er mir bei klick auf das thumbnail ein popup mit dem originalbild öffnet. Dies wäre mit Javascript kein Problem, jedoch würde da ein weiter/zurück button fehlen, womit ich das nächste bild etc. aufrufen kann.
    Ich hoffe ich hab mich halbwegs verständlich ausgedrückt, was mein Problem ist.
    Kann mir da jemand weiterhelfen?

    Hier mal mein bisheriger Code:

    PHP-Code:
     $bilder = array(); 
         $bild_klein = "pub/multimedia/galerie/".$saison."/".$gruppe."/".$spiel."/thumbnail"; 
         $bild_gross = "pub/multimedia/galerie/".$saison."/".$gruppe."/".$spiel; 
     
     if ((    file_exists($bild_gross)) && (is_dir($bild_gross))) 
      { 
          $thumbnail = opendir($bild_klein); 
      while (    $info=readdir($thumbnail)) 
       { 
        if ((    $info != "index.php") AND ($info != ".") AND ($info != "..") AND ($info != "Thumbs.db")) 
         { 
             $bildzeile = "<td align=\"center\"><a href=\"javascript:blank('".$bild_gross."/".$info."',750,500)\"><img src=\"".$bild_klein."/".$info."\" width=\"100\" border=\"0\" alt=\"\" style=\"border:1px solid #000000;\" /></a></td>"; 
     
              array_push($bilder, $bildzeile); 
         } 
       } 
          closedir($thumbnail); 
     
          sort($bilder); 
          $anzahl = count($bilder); 
     
      for(    $i = 0; $i < $anzahl; $i++) 
       { 
       if ((    $i%5 == 0) && ($i != 0)){echo "</tr><tr class='sub2_table'>";} 
       echo     "$bilder[$i]"; 
       } 
      } 
    Stichworte: -
  • #2
    Hallo und Willkommen im Forum!

    Also das mit dem Zurück Button müsste glaube ich mit history="back" funktionieren. Aber wie zum nächsten weist ich nicht.

    mfg der Litter
    Aus dem Dynamo Lande kommen wir. Trinken immer reichlich kühles Bier. Und dann sind wir alle voll, die Stimmung ist so toll. Aus dem Dynamo Lande kommen wir.
    [URL]http://www.lit-web.de[/URL]

    Kommentar

    • #3
      wow, sogar dynamofans findet man hier

      ja so eine javascript-variante mit zurück, wollte ich eigentlich nicht verwenden, sondern gleich den vor und zurück-link per php generieren ... aber es scheitert ja schon daran, erstmal ein richtiges popup (zur zeit wird ja nur das bild im popup geöffnet) zu öffnen ...

      Kommentar

      • #4
        Hallo!

        Was ist denn deiner Meinung nach en richtiges popup?

        hier mal ein Code den ich verwende!

        Code:
        <script language="JavaScript" type="text/javascript">
<!--
function auf(url) {
windowName = "";
options  = "";
options += "toolbar=0,";
options += "location=0,";
options += "directories=0,";
options += "status=0,";
options += "menubar=0,";
options += "scrollbars=1,";
options += "resizable=1,";
options += "width=450,";
options += "height=300,";
options += "left=300,";
options += "top=200";
win = window.open(url, windowName , options);
if (!win.opener) {
win.opener = window;
}
};
//-->
</script>
<a href="javascript:auf('news_pic_upload.php');">[ Bild einfügen ]</a>
        Das ist eins Popup Fenster wie ich es öffne! Da kannst in den optionen einige Sachen einstellen!

        Mit dem vor und zurück per php würde eigentlich denke ich wie eine blaetterfunktion funktionieren. Habe sowas aber auch noch nicht gemacht!

        Na klar ich gehe seid 24 Jahren zu Dynamo schon als 6 Jähriger Junge habe ich mein erstes Spiel gegen Magdeburg erlebt. Einmal Dynamo immer Dynamo!

        mfg der litter
        Aus dem Dynamo Lande kommen wir. Trinken immer reichlich kühles Bier. Und dann sind wir alle voll, die Stimmung ist so toll. Aus dem Dynamo Lande kommen wir.
        [URL]http://www.lit-web.de[/URL]

        Kommentar

        • #5
          Zitat von Dynamite53 Beitrag anzeigen
          aber es scheitert ja schon daran, erstmal ein richtiges popup (zur zeit wird ja nur das bild im popup geöffnet) zu öffnen ...
          Dann loes doch zunaechst dieses Problem mit:
          SELFHTML: JavaScript / Objektreferenz / window

          und melde dich danach wieder.
          "[URL="http://www.youtube.com/watch?v=yMAa_t9k2VA&feature=youtu.be&t=25s"]Mein Name ist Lohse, ich kaufe hier ein.[/URL]"

          Kommentar

          • #6
            War vielleicht falsch ausgedrück von mir, wie man ein popup öffnet, weiß ich ja ... habe ich damit getan:
            Code:
            <script language="Javascript">
function blank(desktopURL,w,h)
{ var foo= window.open("","_blank","toolbar=no,location=no,status=no,menubar=no,scrollbars=no,width="+w+",height="+h+",left=50,top=50");
foo.document.writeln("<html><head><title>Foto</title></head><body><div style=\"position: absolute; top: 0; left: 0;\"><layer><img src=\""+desktopURL+"\"></div></layer></body></html>");
}
</script>
            Code:
            <a href=\"javascript:blank('".$bild_gross."/".$info."',750,500)\">
            Aber so öffnet er nur das Bild in einem popup, ohne Links "nächstes Bild" und "vorhergehendes Bild" und dies wird doch sicher nicht mit javascript gehen oder? weil wie will er denn sonst wissen, was das nächste und letzte bild ist?!

            Kommentar

            • #7
              Mit AJAX würde das sicher gehen!

              Aber ich schrieb das ja bereits,das würde im Prinzip wie eine Blaetterfunktion ablaufen.

              Dazu findest du bestimmt im Netz was!
              Aus dem Dynamo Lande kommen wir. Trinken immer reichlich kühles Bier. Und dann sind wir alle voll, die Stimmung ist so toll. Aus dem Dynamo Lande kommen wir.
              [URL]http://www.lit-web.de[/URL]

              Kommentar

              • #8
                Du kannst als Popup durchaus auch ein php Script aufrufen. Blätterfunktion ja, Ajax nein. Einfach zwei Links auf das Script im Fenszter selbst mit Integer Offsetwerten.

                Probleme (und damit zwingend Javascript) bekommst Du durch verschiedene Bild- und damit Fenstergrößen. Die nicht so schicke Alternative ist einfach ein target _new Link vom Hauptscript aus.

                Ein weiterer bemerkenswerter Faktor sind Popupblocker.
                [COLOR="#F5F5FF"]--[/COLOR]
                [COLOR="Gray"][SIZE="6"][FONT="Georgia"][B]^^ O.O[/B][/FONT] [/SIZE]
                „Emoticons machen einen Beitrag etwas freundlicher. Deine wirken zwar fachlich richtig sein, aber meist ziemlich uninteressant.
                [URL="http://www.php.de/javascript-ajax-und-mehr/107400-draggable-sorttable-setattribute.html#post788799"][B]Wenn man nur Text sieht, haben viele junge Entwickler keine interesse, diese stumpfen Texte zu lesen.“[/B][/URL][/COLOR]
                [COLOR="#F5F5FF"]
                --[/COLOR]

                Kommentar

                • #9
                  Danke schonmal für die Antworten ... zwecks popupblocker werde ich noch einen hinweis setzen, dass dieser aktiviert werden sollte, da bilder mit einer breite von 750px direkt in der seite nicht aussehen bzw. es dadurch die ganze seite verzerren würde ... daher hab ich mich für popup entschieden.
                  Mein problem ist, dass die bilder noch keine eigene id haben (glaube ich zumindest, siehe script aus dem ersten beitrag) ... daher hab ich auch keine ahnung, wie ich zum aufrufen des popups, also einer extra php-datei, das eigentliche bild, was angeklickt wurde, übermitteln kann.

                  Grob gesagt hab ich mir das eigentlich so vorgstellt:
                  - bei klick auf das thumbnail wird eine popup.php aufgerufen
                  - es wird der pfad sowie eine bild-id übermittelt
                  - das bild wird in der popup.php durch den pfad sowie die bild-id angezeigt
                  - mit $bild_id++; oder $bild_id--; gibt es einen link für vor/zurück

                  Nur haperts eben an der umsetzung, vor allem erstmal daran, dass ich jedem bild eine bild_id verpasse...

                  Kommentar

                  • #10
                    Zuletzt geändert von nikosch; 13.06.2008, 01:43.
                    Wie siehts denn aus, bist Du weitergekommen? Ein paar Anmerkungen:
                    - benutze einen extra Ordner für die Bilder
                    - Du könntest eine Bildliste als Textdatei speichern und diese im 'Bildanzeigescript' einlesen. Durch die Suche des aktuellen Bildes kannst Du einfach Vorgänger und Nachfolger bestimmen. Als Index (also Schlüssel für den konkreten Aufruf) genügte dann der Dateiname, da dieser ja eindeutig innerhalb der selben Ordnerhierarchiestufe ist. Oder Du liest o.g. Textdatei gleich als Array ein und greifst die numerischen Schlüssel über eine ebensolche ID ab.
                    Mal exemplarisch und ungetestet:
                    PHP-Code:
                    <?
                    $pics = file ('anypath/bildliste.txt'); // Bildliste in Array laden
                    $current = (int) $_GET['show']; // Schlüssel holen
                    $current = min (max (0 , $current) , (count ($pics) - 1)); // zulässigen Bereich einschränken
                    $next = $current+1;
                    $prev = $current-1;

                    ?><img src="<?= $path . trim ($pics[$current]); ?>" /><a href="?show=<?= $next ?>">weiter</a>
                    Für einfache Anwendungen reicht das, sonst geht natürlich auch eine Datenbank mit echten Idizies.
                    [COLOR="#F5F5FF"]--[/COLOR]
                    [COLOR="Gray"][SIZE="6"][FONT="Georgia"][B]^^ O.O[/B][/FONT] [/SIZE]
                    „Emoticons machen einen Beitrag etwas freundlicher. Deine wirken zwar fachlich richtig sein, aber meist ziemlich uninteressant.
                    [URL="http://www.php.de/javascript-ajax-und-mehr/107400-draggable-sorttable-setattribute.html#post788799"][B]Wenn man nur Text sieht, haben viele junge Entwickler keine interesse, diese stumpfen Texte zu lesen.“[/B][/URL][/COLOR]
                    [COLOR="#F5F5FF"]
                    --[/COLOR]

                    Kommentar

                    Vorherige Weiter
                    Lädt...
                    X