Gallerie polaroid en CSS3 et jQuery

Voici une gallerie polaroid en CSS3 et en jQuery. Cette gallerie utilise les propriétés box-shadow, transition et transform.

Les évènements sont gérés en javascript (framework jQuery).

Demo Gallerie polaroid

1
Image 5
1
Image 4
1
Image 3
1
Image 2
1
Image 1
Previous
Next

Téléchargement

le fichier css

le fichier javascript

le code HTML

<div class="galleriePolaroid"> <h2>Demo Gallerie polaroid</h2> <div class="item i1"> <img src="/images/slideshow/1.jpg" alt="1"> <div> Image 5 </div> </div> <div class="item i2"> <img src="/images/slideshow/2.jpg" alt="1"> <div> Image 4 </div> </div> <div class="item i3"> <img src="/images/slideshow/3.jpg" alt="1"> <div> Image 3 </div> </div> <div class="item i4"> <img src="/images/slideshow/4.jpg" alt="1"> <div> Image 2 </div> </div><div class="item i5 active" style="left: 284px; "> <img src="/images/slideshow/5.jpg" alt="1"> <div> Image 1 </div> </div> <div class="left" onclick="previous()" style="display: none; "><span>Previous</span></div> <div class="right" onclick="next()"><span>Next</span></div> </div>
retourner en haut de la page