Istotope JS

I found the Isotope JQuery plugin a few years ago and was immediately impressed with the filtering functionality and animation it provided on the front-end. I never really had time to sit and play with it until recently. I can now say I am in love with it.

The plugin David DeSandro has built is probably one of the most enjoyable plugins I have used in a really long time. The amount of “WOW” you can add to a site with such minimal effort is really amazing.

The Isotope plugin is built on top of JQuery and allows developers to add filters to their site content. When a user selects a filter, the content that matches the filter will animate in or out depending on whether the container has a class added or not. Isotope will also enable you to control the way your content is displayed on the page (horizontal, vertical, fill up space).

For a quick tutorial on how to use Isotope, check out a great tutorial written by Joe Bondra at:
http://digitalunion.osu.edu/2013/03/15/jquery-isotope-a-brief-introduction-and-tutorial/

Recently, I was able to spend a few hours with Isotope and built something that I was quite impressed. The sample site I built will eventually be the home of a one page portfolio site where I can add projects I work on. But for now all the content is for show. You can see a demo of this experiment here at http://123adapt.com/beta/

For more information about Isotope and how to use it, visit http://isotope.metafizzy.co/

 

Leave a Reply