Infinite scrolling gallery

Explosive cocktail of jQuery plugins you probably are very used to seeing around the web and didn’t know.

In a nutshell, Isotope, the chemical arrangement by David Desandro, helps create a grid style layout with totally out of the box responsive and fluid properties and many options; Infinite Scroll, by Paul Irish, will ease the navigation not having to click through pages anymore (yes, you’re right, just like Google images, Twitter, Facebook, Pinterest…); Inview, by Protonet, applies some nice effects to the blossoming content; and finally Lightbox, by Lokesh Dhakar provides an overlay to display full screen images when clicked.

I’ve been dealing with them for the past few days just for the sake of playing around and, as Desandro himself says, I “hit a brick wall [or several], like ‘this shit ain’t never gonna work’, but you were [I was] so deep in the trenches that you’d [I’d] rather die with you eyelids open staring at code than to admit defeat“. It’s 6am right now and I just finished tweaking the gallery I wanted to do, so yeah, that description is totally applicable.

So, for my own comfort of having it written and for anyone facing an Isotope like implementation. Follow these pages for a step-by-step explanation on how to install a simple gallery of pictures to scroll down infinitely.

Here’s a zip with the file resulting project:


Author: Bea Cabrera

Freelance Filmmaker with a passion for big cities, snowboard, cinema and a weakness for the smell of freshly ground coffee. Engineer & Graphic Designer in a previous life, loving and living both: art and technology.  

Leave a Reply

Your email address will not be published.

You may use these <abbr title="HyperText Markup Language">html</abbr> tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong>


This site uses Akismet to reduce spam. Learn how your comment data is processed.