Cerca
Filtra la ricerca ...
Frase esatta
Categorie

Blocksit.js il plugin jQuery per creare griglie responsive

Blocksit.js è un plugin jQuery utilizzato per creare layout HTML con griglie dinamiche, converte gli elementi HTML in blocchi e li posiziona in un griglia utilizzando la proprietà CSS “absolute”; in pratica è in grado di calcolare automaticamente le posizioni “top” e “left” utilizzando questo criterio :

  1. Posiziona i blocchi da sinistra a destra
  2. Posiziona i nuovi blocchi sotto i blocchi più piccoli

E’ sufficiente specificare il numero di colonne da utilizzare ed il plugin farà il resto, facile no ?

Come creare un layout in stile Pinterest

Sfruttando le potenzialità di questo plugin, scriviamo un piccolo script per creare un layout a griglie responsive in stile Pinterest, come quesllo in figura.

come creare layout stile pinterest

Creare un documento HTML e richiamare la libreria jQuery ed il plugin Blocksit

 Ora un pò di jQuery da inserire prima delle chiusura del tag

ora il codice l’HTML (per motivi di spazio non incollo tutto il codice, a fine pagina come sempre trovate il file sorgente e la demo)

antilope

antilope

Lorem Ipsum è un testo segnaposto utilizzato nel settore della tipografia e della stampa. Lorem Ipsum è considerato il testo segnaposto standard sin dal sedicesimo secolo….

by Autore

ed infine il CSS

Potrebbe interessarti anche ...

Lascia un commento

Questo sito usa Akismet per ridurre lo spam. Scopri come i tuoi dati vengono elaborati.