"5c4tt3r"
Bootstrap 3.3.0 Snippet by okebro

<link href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.0/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css"> <script src="//maxcdn.bootstrapcdn.com/bootstrap/3.3.0/js/bootstrap.min.js"></script> <script src="//code.jquery.com/jquery-1.11.1.min.js"></script> <!------ Include the above in your HEAD tag ----------> <!DOCTYPE html> <html lang="en" class="no-js"> <head> <meta charset="UTF-8" /> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1"> <title>Scattered Polaroids Gallery</title> <meta name="description" content="Scattered Polaroids Gallery: A flat-style take on a Polaroid gallery" /> <meta name="keywords" content="scattered polaroids, image gallery, javascript, random rotation, 3d, backface, flat design" /> <meta name="author" content="Codrops" /> <link rel="stylesheet" type="text/css" href="http://rumart.weebly.com/files/theme/normalize.css" /> <link rel="stylesheet" type="text/css" href="http://rumart.weebly.com/files/theme/demo.css" /> <link rel="stylesheet" type="text/css" href="http://rumart.weebly.com/files/theme/component.css" /> <script src="http://rumart.weebly.com/files/theme/modernizr.min.js"></script> </head> <body> <div class="container"> <!-- Top Navigation --> <section id="photostack-1" class="photostack photostack-start"> <div> <figure> <a href="#" class="photostack-img"><img src="http://rumart.weebly.com/files/theme/001.jpg" alt="img01"/></a> <figcaption> <h2 class="photostack-title">Serenity Beach</h2> </figcaption> </figure> <figure> <a href="#" class="photostack-img"><img src="http://rumart.weebly.com/files/theme/002c.jpg" alt="img02"/></a> <figcaption> <h2 class="photostack-title">Happy Days</h2> </figcaption> </figure> <figure> <a href="#" class="photostack-img"><img src="http://rumart.weebly.com/files/theme/003.jpg" alt="img03"/></a> <figcaption> <h2 class="photostack-title">Beautywood</h2> </figcaption> </figure> <figure> <a href="#" class="photostack-img"><img src="http://rumart.weebly.com/files/theme/011.jpg" alt="img04"/></a> <figcaption> <h2 class="photostack-title">Heaven of time</h2> </figcaption> </figure> <figure> <a href="#" class="photostack-img"><img src="http://rumart.weebly.com/files/theme/005.jpg" alt="img05"/></a> <figcaption> <h2 class="photostack-title">Speed Racer</h2> </figcaption> </figure> <figure> <a href="#" class="photostack-img"><img src="http://rumart.weebly.com/files/theme/006.jpg" alt="img06"/></a> <figcaption> <h2 class="photostack-title">Forever this</h2> </figcaption> </figure> <figure data-dummy> <a href="#" class="photostack-img"><img src="http://rumart.weebly.com/files/theme/007.jpg" alt="img07"/></a> <figcaption> <h2 class="photostack-title">Lovely Green</h2> </figcaption> </figure> <figure data-dummy> <a href="#" class="photostack-img"><img src="http://rumart.weebly.com/files/theme/008.jpg" alt="img08"/></a> <figcaption> <h2 class="photostack-title">Wonderful</h2> </figcaption> </figure> <figure data-dummy> <a href="#" class="photostack-img"><img src="http://rumart.weebly.com/files/theme/009.jpg" alt="img09"/></a> <figcaption> <h2 class="photostack-title">Love Addict</h2> </figcaption> </figure> <figure data-dummy> <a href="#" class="photostack-img"><img src="http://rumart.weebly.com/files/theme/010.jpg" alt="img10"/></a> <figcaption> <h2 class="photostack-title">Friendship</h2> </figcaption> </figure> </div> </section> </div><!-- /container --> <script src="http://rumart.weebly.com/files/theme/classie.js"></script> <script src="http://rumart.weebly.com/files/theme/photostack.js"></script> <script> // [].slice.call( document.querySelectorAll( '.photostack' ) ).forEach( function( el ) { new Photostack( el ); } ); new Photostack( document.getElementById( 'photostack-1' ), { callback : function( item ) { //console.log(item) } } ); new Photostack( document.getElementById( 'photostack-2' ), { callback : function( item ) { //console.log(item) } } ); new Photostack( document.getElementById( 'photostack-3' ), { callback : function( item ) { //console.log(item) } } ); </script> </body> </html>

Related: See More


Questions / Comments: