Un cubo 3D per le immagini con CSS3

Un'ottimo esempio di come giocare in maniera estrema con i metodi 3D, offerti dalle recenti specifiche CSS3, e creare qualcosa di diverso dal solito: un cubo 3D per la visualizzazione di immagini. Una soluzione impensabile da realizzare fino a pochi anni fa senza l'ausilio di flash o simili, resa ormai possibile tramite i soli CSS.

L'autore ha utilizzato questo approccio nel suo sito web per creare l'effetto rotativo in primo piano, estendendola poi con la creazione di un cubo e relativo movimento di ogni sua faccia.

L'esempio è un ottimo spunto per studiare (o approfondire) i metodi di rotazione e trasformazione CSS3, combinandoli con l'uso di SASS per ottimizzare la scrittura del codice tramite l'uso di variabili e accorpamento di sottoelementi, e aggiungendo interattività tramite il Checkbox Hack per scatenare l'evento di rotazione a seguito dell'alterazione di stato di un campo checkbox.