Bilder Vorschau

  • Hi, ich habe mir nun mittels php eine Webseite erstellt, welche mir eine Bilder Kollage ausgibt ( Die Bilder nimmt sie aus einem Ordner welcher zusammen mit der Seite gespeichert ist )


    Hier der Code dazu:

    Meine Frage ist nun wie kann ich es machen, dass wenn man einmal auf ein Bild drauf klickt eine kleine Vorschaue des Bildes hat ( vergrößert angezeigt [optional mit ein kleines kreuz zum wieder Schließen] ) ?

  • Wie meinst du das? Die Bilder werden doch jetzt schon als mittelgroßes Bild angezeigt oder sehe ich das falsch?

    Wenn du sie kleiner haben willst dann lass sie doch gleich kleiner anzeigen?


    Aber ich denke mal, das so was suchst oder

    * Link entfernt , weil existiert nicht mehr *

    oder das

    * Link entfernt , weil existiert nicht mehr *

    oder

    * Link entfernt , weil existiert nicht mehr *


    Sowas in der Art gibt es 1000 Fach. Doch mehr funktionierende habe ich nicht rumfliegen.

    Such mal bei Googel unter Fancybox, da findest du genug. Das ist aber Javascript denk daran. Da muss du nur wissen wie du die Bilder darein bekommst, ist aber kein Problem.

  • Also ich meinte eigentlich so etwas wie der dritte Link den basti geschickt hatte, wäre schön dazu ein wenig Erklärung zu haben.


    Wenn ich das richtig verstanden habe brauche ich für dieses fancyapp eine jQuerry oder ? ( kenn mich mit JavaScript eher weniger aus )

  • Ich hab mal ein Bild angehangen von meiner Webseite wie sie momentan aussieht, wenn man nun auf ein Bild anklickt soll dieses vergrößert in der Mitte des Bildschirmes angezeigt werden ( am besten wäre es wenn es sich im Vordergrund schiebt also über allen anderen content )

  • Ok hab es jetzt geschafft, dass die mit einer Vorschau angezeigt werden Danke für eure Hilfe <3


    Eine Frage hätte ich da jetzt allerdings noch ^^

    wie kann ich das machen, dass nur eine bestimmte Anzahl an Bilder angezeigt wird ? ( hab ja jetzt eine Schleife die Alle Bilder im Ordner ausliest und anzeigt ).

    Bin mir nicht sicher an welcher Stelle genau ich in meinem Code da so eine Zähler Variable oder ähnliches einbauen müsste.

    Hier nochmal mein Code mit fancybox zusammen.

  • Hey,


    du kannst zum Beispiel das Array mit den Bildern mischen mittels der Funktion shuffle() und dann mit der Funktion array_slice() kürzen. Oder du zählst eine Variable in der While-Schleife hoch und beendest diese wenn ein bestimmter Wert erreicht ist mittels break;


    Grüße,

    Stef

  • Hab jetzt versucht da eine zähler variable einzubinden ( shuffle war mir jetzt zu kompliziert wüsste nicht wo und wie ich das einbauen könnte ), dennoch kommt bei mir nun eine Fehlermeldung:


    Notice: Undefined variable: bilderdateinamen in E:\xampppp\htdocs\images\Foto-Kugler.php on line 50
    Warning: Invalid argument supplied for foreach() in E:\xampppp\htdocs\images\Foto-Kugler.php on line 50


    Was hab ich falsch gemacht ?


    Keine Ahnung was das Problem war beim Browser neustart ging es plötzlich wieder.

    Dann werde ich mir doch noch mal dieses shuffle anschauen.

  • Hey,


    ProOfNoobs : schau dir mal deine Klammern an, da sieht man sofort, dass was falsch ist. Außerdem verwechselst du da etwas im if-else.


    Du willst, dass bei 15 Bilder die Schleife abgebrochen wird? Pseudobeispiel dazu:



    Stef

  • Mal so nebenbei irgendeine Idee wie ich es mache, dass alle Bilder zentriert sind ?

    hab schon ausprobiert:

    <center>...</center> ( Ich weiß recht veraltet )

    <div align="center">..</div>


    Mittels CSS:

    display: kollage; justify-content: center; align-items: center;<-- div class="kollage">


    hab sogar versucht es in einem <h1 align="center">..</h1>zu umfassen.


    Alles vergebens.

  • Kleiner Tipp:

    PHP
    $bilderdateinamen = glob( './*.jpg' );

    ersetzt komplett das:

  • Hab es momentan so:

    funktioniert auch ganz gut ( außer die zentrierung )

  • Du willst also nur die ersten 4 .jpg Bilder haben, die in dem Verzeichnis gefunden werden?

    PHP
    $bilderdateinamen = array_slice( glob('./*.jpg'), 0, 4);

    Wenn ihr PHP entwickeln wollt, solltet ihr immer ein Blick auf php.net haben

  • Bzgl. der Zufallsbilder noch ein kleiner Hinweis.

    Du berücksichtigst alle Bilder in shuffle(), wenn Du zuerst alle Bilder lädst und nach dem Würfeln die ersten X Bilder holst:

    PHP
    $aImages = glob( './*.jpg' );
    shuffle( $aImages );
    
    $aImageFileNames = array_slice( $aImages, 0, X ); // <-- X: Anzahl der Bilder, die Du verwenden möchtest

Jetzt mitmachen!

Sie haben noch kein Benutzerkonto auf unserer Seite? Registrieren Sie sich kostenlos und nehmen Sie an unserer Community teil!