Più di 30 plugin per jQuery per:

  • realizzare gallerie fotografiche, slideshow e slider;
  • personalizzare l’aspetto dei moduli e del testo;
  • creare moderni layout a griglia in stile Pinterest o Windows 8.

Plugin per le immagini

jQuery Magnific Popup

Galleria fotografica in stile lightbox che garantisce la massima usabilità in tutti i dispositivi compresi quelli mobili. Consente di visualizzare immagini, video (anche da youtube o vimeo), finestre modali, mappe di Google e form. Supporta i dispositivi con schermi ad alta densità di pixel come i Retina.

Magnific Popup

Magnific Popup

Supporta jQuery e Zepto. Per maggiori informazioni leggere anche jQuery Magnific Popup: gallerie fotografiche responsive.

jQuery PrettyPhoto

Uno dei cloni di Lightbox più utilizzati per visualizzare immagini e altri contenuti.

jQuery PrettyPhoto

jQuery PrettyPhoto

Dispone di diversi temi con cui personalizzare il plugin. Leggere anche jQuery prettyPhoto: alternativa a lightbox per immagini e altri contenuti.

Fotorama

Galleria fotografica responsive e fortemente personalizzabile mediante una serie di opzioni dichiarative e non attraverso istruzioni javascript.

Fotorama

Fotorama

Può essere utilizzata per visualizzare vari tipi di contenuti, tra cui: immagini, video, iframe e altri elementi html.

Colorbox

Collaudato plugin per visualizzare immagini o altro contenuto (iframe, elementi html anche in linea, video) con lo stile lightbox.

Colorbox

Colorbox

L’aspetto del plugin può essere personalizzato con uno dei temi disponibili oppure con un tema personalizzato.

Rambling Slider

Evoluzione del famoso Nivo Slider consente di scegliere tra una numerosa serie di transizioni.

Rambling Slider

Rambling Slider

Rambling Slider consente anche di visualizzare nella didascalia del contenuto strutturato in html.

Blueimp image gallery

Un solo plugin per realizzare photogallery in stile lightbox oppure una slideshow.

Blueimp Gallery

Blueimp Gallery

L’aspetto del plugin può essere modificato attraverso una serie di temi predefiniti. Anche l’effetto di visualizzazione del plugin può essere modificato scegliendo tra una serie di opzioni.

jQuery fs Wallpaper

Adatta un’immagine o un video alle dimensioni della finestra scalandola mantenendo le corrette proporzioni. Fa parte della collezione di plugin formstone.

jQuery FS Wallpaper

jQuery FS Wallpaper

Per altre informazioni consultare l’articolo jQuery fs wallpaper: immagini responsive o visualizzare la demo correlata.

Lazy Load XT

Ritarda il caricamento delle immagini finché non entrano nella viewport del browser rendendo il caricamento della pagina più veloce. Adatto a documenti molto lunghi con un gran numero di immagini.

Lazy Load XT

Lazy Load XT

Per altre informazioni consultare l’articolo jQuery Lazy Load Xt: ritardare il caricamento delle immagini o visualizzare la relativa demo.

Zoomooz

Consente di zoomare un’immagine o un qualsiasi altro elemento della pagina adattandolo alla finestra del browser. Agli elementi è possibile applicare anche trasformazioni css per ottenere interessanti effetti.

Zoomooz

Zoomooz

Per ulteriori informazioni consultare l’articolo jQuery Zoomooz: zoomare immagini e testo o visualizzare la relativa demo.

jQuery Zoom

Ingrandisce un’immagine al passaggio del mouse, al click o al tocco (nei dispositivi mobili).

jQuery Zoom

jQuery Zoom

L’immagine viene ingrandita senza modificare la dimensione complessiva dell’immagine e perciò senza interferire con gli elementi circostanti.

Plugin per visualizzare finestre modali

Remodal

Visualizza una finestra modale completamente personalizzabile con una notazione dichiarativa e non con istruzioni javascript.

Remodal

Remodal

Remodal può essere utilizzata per visualizzare immagini, video, messaggi o moduli.

Avgrund Modal

Finestra modale innovativa e facilmente personalizzabile che riduce le dimensioni del contenuto principale e gli sovrappone un effetto overlay mentre visualizza la finestra modale.

Avgrund Modal

Avgrund Modal

Avgrung è compatibile con i browser più diffusi.

Featherlight.js

Piccolissimo plugin (3.7Kb) che consente di visualizzare immagini, un iframe o altro contenuto con un effetto overlay.

Featherlight.js

Featherlight.js

I contenuti possono essere caricati anche mediante una richiesta AJAX.

Plugin per il testo

Fit tetx

Adatta le dimensioni del testo a cui è applicato a quelle del monitor del dispositivo in cui la pagina viene visualizzata. Può essere applicato solo a elementi di tipo blocco ed è adatto per i titoli di un documento.

Fit Text

Fit Text

Esiste anche una versione di fittext che non richiede jQuery e che può essere scaricata nel repository di GitHub di fittext. Il tutorial jQuery fitText: adattare il testo al dispositivo consente di imparare a usare fittext in pochi minuti.

Lettering.js

Converte il testo dell’elemento html a cui viene applicato in una serie di span, uno per ciascun carattere, che possono essere così selezionati singolarmente e modificati come si desidera.

Lettering.js

Lettering.js

Lettering.js consente di realizzare effetti di testo molto particolari.

Powertip

Rimpiazza i tooltip predefiniti del browser con dei tooltip personalizzabili.

Powertip

Powertip

Per ulteriori informazioni leggere anche jQuery Powertip: creare tooltip complessi.

Plugin per i moduli

Selectize.js

Trasforma una casella di selezione (elemento select) in un controllo ibrido che consente all’utente di selezionare una voce o di aggiungerla.

Selectize.js

Selectize.js

Selectize.js consente anche il caricamento remoto nel caso la lista contenga un numero elevato di voci.

jQuery Selectric

Consente di modificare l’aspetto degli elementi select non solo per fini estetici ma anche per migliorare al loro usabilità soprattutto nei dispositivi mobili.

jquery Selectric

jquery Selectric

Selectric consente di realizzare anche voci con altezza variabile dipendente dal contenuto.

Icheck

Consente di personalizzare l’aspetto dei controlli checkbox e radiobutton rendendoli coerenti in tutti i browser. Supporta i dispositivi mobili e per questo può essere utilizzato non solo con jQuery ma anche con Zepto.

jquery Icheck

jquery Icheck

Il colore dei controlli può essere definito nel sito web del plugin scaricando poi, il plugin completo del foglio di stile css  necessario.

jQuery Pass*Field

Permette una completa personalizzazione dei controlli password con una serie di utili funzionalità, tra cui: mostra/nascondi password, genera password, verificare la robustezza della password, mostrare un avvertimento e molto altro ancora.

jQuery Pass Field

jQuery Pass Field

Pass*Field è distribuito anche in versione stand alone per funzionare anche senza jQuery.

Navigazione e altri elementi della pagina

Perfect-scrollbar

Consente di controllare l’aspetto della barra di scorrimento di un qualsiasi elemento html rendendola più moderna e accattivante.

Perfect Scrollbar

Perfect Scrollbar

La barra di scorrimento è completamente personalizzabile mediante gli stili css.

Easy Responsive Tabs to Accordion

Trasforma automaticamente un sistema a schede (tabs) in un pannello a fisarmonica (accordion) al di sotto di una cerca risoluzione migliorando l’usabilità del documento nei dispositivi mobili.

Easy Responsive Tabs to Accordion

Easy Responsive Tabs to Accordion

La larghezza in cui deve verificarsi la trasformazione può essere controllata mediante l’opzione width del plugin.

Sticky kit

Fissa l’elemento a cui viene applicato quando l’elemento genitore viene scrollato.

Sticky Kit

Sticky Kit

Sticky Kit evita le fastidiose sovrapposizioni con il footer e consente un parziale scorrimento se l’elemento fisso è più lungo dell’area di visualizzazione.

BigSlide.js

Visualizza un pannello di navigazione laterale spostando l’intera pagina sul lato opposto.

jQuery Bigslide

jQuery BigSlide

L’aspetto della sidebar può essere controllato con i fogli di stile css.

Sidebar.js

Come il precedente visualizza una barra laterale spostando il contenuto principale della pagina sul lato opposto.

SidebarJS

SidebarJS

Quando la sidebar viene visualizzata parte del contenuto principale può essere temporaneamente nascosto.

jQuery.spritely

Plugin che consente di realizzare animazioni basate su sprite utilizzando solo HTML e javascript. Il plugin consente l’interazione utente che può modificare l’animazione durante la sua riproduzione.

jQuery Spritely

jQuery Spritely

Spritely non è semplicissima da utilizzare ma il risultato che si ottiene vale il lavoro necessario per realizzarlo.

Layout a griglia

Masonry

Tra i migliori plugin jquery non poteva mancare uno dei più famosi plugin per layout a griglia fluidi.

Masonry

Masonry

Masonry calcola lo spazio disponibile e posiziona gli elementi della pagina nel modo più efficiente possibile.

BlocksIt.js

Plugin per layout a griglia dinamici in stile Pinterest o flex.

BlocksIt.js

BlocksIt.js

BlockIt.js come gli altri plugin di questo tipo è indicato per posizionare in maniera dinamica e responsiva elementi con altezza diversa ottimizzando lo spazio disponibile.

jQuery Free Wall

Plugin complesso che consente di realizzare diversi tipi di layout a griglia tra cui layout in stile flex, windows 8 e pinterest. Semplice da utilizzare ma molto potente.

jQuery Free wall

jQuery Free wall

Free wall consente di trascinare gli elementi del layout o di applicare ad essi animazioni di vario genere. Può essere utilizzata anche con Zepto.

Wookmark

Altro plugin con cui realizzare dei layout a griglia in stile Pinterest.

jQuery Wookmark

jQuery Wookmark

Non dispone del numero di opzioni degli altri plugin ma è veramente semplice da utilizzare.

Isotope

Isotope è un layout engine molto versatile con cui creare diversi tipi di layout a griglia dinamici.

Isotope

Isotope

Tra le numerose opzioni si può scegliere anche di disporre gli elementi in orizzontale e non solo in verticale come negli altri plugin dello stesso tipo.

 

Per tutti gli altri plugin di jQuery si consiglia di consultare periodicamente il jQuery Plugin Registry.