Dovevo realizzare un template grafico, per un sito web che si occupa di fotografia professionale, e mi è venuta in mente una idea mentre stavo preparando la grafica con Figma.

Come tutti noi sappiamo, dare una idea al cliente di quello che non è dinamico e reattivo, nelle grafiche, è veramente difficile, per questo ho deciso di passare ai fatti, creando un mockup dinamico, di quello che dovrà essere nella realtà.

Ho realizzato un Multi Photo Carousel.

Ovviamente non una riga di JavaScript è stata scritta 😄

Questo è un esempio completamente in HTML e CSS. Sono regole di base che vanno benissimo su Chrome o browser più moderni, ma che con un autoprefixer (io uso Gulp npm i gulp-autoprefixer).

Con un autoprefixer vi dovreste sbattere meno nello scrivere a mano tutti i suffissi specifici per browser, come: -webkit-, -ms-, -moz-, -o-, -ms-

Ed ecco a voi la mia realizzazione, dalla quale potete partire e sfruttare per i vostri progetti.

See the Pen CSS infinite photo carousel by Christian Pucci (@minimamente) on CodePen.