Visualizzazione dei risultati da 1 a 3 su 3
  1. #1
    Utente di HTML.it L'avatar di Salvy95
    Registrato dal
    Jul 2008
    Messaggi
    199

    Galleria foto di diverse dimensioni

    Buonasera!
    Ho bisogno di un piccolo consiglio dai massimi esperti italiani di CSS e web grafica
    Necessiterei di una photogallery per il mio sito web che gestisca foto di dimensioni diverse caricate da uno script php (GD).
    Le foto possono essere scattate in verticale come in orrizzontale. Questo fattore non è assolutamente prevedibile apriori.
    Le immagini io posso richiamarle con una tag img

    Codice PHP:
    <img src="script.php?image=1"> <...></...><img src="script.php?image=2 
    Conoscete qualche soluzione già pronta?

    Grazie mille per la cortesia

    Immagine.png
    Ultima modifica di Salvy95; 21-02-2018 a 17:00

  2. #2
    Moderatore di CSS L'avatar di KillerWorm
    Registrato dal
    Apr 2004
    Messaggi
    5,674
    Ciao, la parola chiave per quel tipo di impaginazione è "masonry". Personalmente sono poco esperto in questa roba ma posso giusto consigliarti di fare qualche ricerca tipo "css masonry" o "masonry image gallery" o qualcosa del genere; di sicuro puoi trovare esempi, guide, tutorial, plugin, framework in varie salse e diverso altro materiale a riguardo. Buona ricerca.
    Installa Forum HTML.it Toolset per una fruizione ottimale del Forum

  3. #3
    Utente di HTML.it L'avatar di Salvy95
    Registrato dal
    Jul 2008
    Messaggi
    199
    Mi sei stato veramente d'aiuto.

    Ho risolto così

    Codice PHP:
    .masonry /* Masonry container */
        
    padding30px;
        
    background-colortransparent;
        
    column-count3;
        
    column-gap1em;
    }

    .
    item /* Masonry bricks or child elements */
        
    background-colortransparent;
        
    displayinline-block;
        
    margin0 0 1em;
        
    width100%;


    Codice PHP:
    <div class="masonry">
       <
    div class="item"><a href="image.php?id=0" rel="lightbox">
       <
    div class="item"><img src="image.php?id=1"/></div>
       <
    div class="item"><img src="image.php?id=2"/></div>
       <
    div class="item"><img src="image.php?id=3"/></div>
       <
    div class="item"><img src="image.php?id=4"/></div>
       <
    div class="item"><img src="image.php?id=5"/></div>
       <
    div class="item"><img src="image.php?id=6"/></div>
    </
    div
    Funziona incredibilmente bene. Ti ingrazio moltissimo.
    Ultima modifica di Salvy95; 23-02-2018 a 18:42

Permessi di invio

  • Non puoi inserire discussioni
  • Non puoi inserire repliche
  • Non puoi inserire allegati
  • Non puoi modificare i tuoi messaggi
  •  
Powered by vBulletin® Version 4.2.1
Copyright © 2024 vBulletin Solutions, Inc. All rights reserved.