Una galleria fotografica reattiva con funzionalità Swipe

Question

Sto cercando di creare una galleria javascript/jquery che soddisfi i criteri riportati di seguito e mi piacerebbe sapere se ci sono dei moduli di galleria esistenti che hanno tutte/la maggior parte di queste funzionalità:

1. Parete fotografica con funzionalità di zoom (vista singola). per esempio. http://tympanus.net/Tutorials/SlidingPanelPhotowallGallery/

2. Responsive, in modo che la tessera Foto immagini parete correttamente per computer desktop & dispositivi mobili, e rimpasto se l'utente ridimensiona il proprio browser. per esempio. http://isotope.metafizzy.co/

3. (facoltativo ma auspicabile). Se un utente si trova su un dispositivo mobile, consenti loro di scorrere le immagini a vista singola.

In breve. Un utente andrà al muro delle miniature, selezionerà un'immagine e potrà quindi scorrere più foto ingrandite o tornare al muro.

Le foto verranno estratte da una cartella sul server. I moderatori sono semplicemente delle telecamere, che caricheranno le immagini dalle loro fotocamere digitali in questa cartella tramite ftp - Non ridimensioneranno/ottimizzeranno le immagini, quindi sarebbe bello se questo potesse accadere anche in questo processo.

Stiamo ospitando un ambiente PHP/Linux.

Answer 1

Dai un'occhiata alla jQuery Mason: http://masonry.desandro.com/

Può essere usato come un muro reattivo.

Quello che chiedi non è chiamato "zoom" (che è un altro effetto), sembra quello che viene chiamato lightbox. Ci sono un sacco di questi, ecco un confronto, http://planetozh.com/projects/lightbox-clones/

immagini per ridimensionare la vostra intenzione di avere a scrivere qualche php di fare uso di GD immagine o ImageMagick, ecco un tutorial, http://net.tutsplus.com/tutorials/php/image-resizing-made-easy-with-php/ o forse uno script, http://shiftingpixel.com/2008/03/03/smart-image-resizer/ (o timthumb.php).

Per servirli dovrete scrivere del php con il vostro javascript.

Non esiste una soluzione tutto in uno per quello che chiedi, dovrai scriverlo o assumere qualcuno per farlo.

Answer 2

Per quanto ne so si deve creare un plugin o scrivere si possiede funzioni jQuery per ottenere tutte le funzioni personalizzate. (Che sarà molto buono in senso di prestazioni e manutenzione)

1. per lo zoom funzionalità che puoi usare alcune delle finestre modali con una chiamata ajax o puoi creare.
2. per ottenere questo devi scrivere bene css in modo che la tua foto allineata secondo screen.reshuffle sarà gestita se scrivi buoni css.
3. sì, è possibile ottenere questo rilevando il navigatore del browser e cambiando il css e javascript di conseguenza.
4. Per le immagini di pre-elaborazione (ridimensionamento, generazione dinamica di thumbanails) è possibile optare per soluzioni di back-end php.
5. E non preoccuparti, puoi gestire le immagini dalla cartella tramite Ajax e mostrarle come richiedono.