Animate any element when it enters the viewport. Currently set to lazy load images with fadeIn.

already-visible.sass

.already-visible
    +opacity(1)
img
    +opacity(0)
    @include animated(1s, .3s)

jQueryVisible.js

/*! jQuery visible 1.0.0 teamdf.com/jquery-plugins | teamdf.com/jquery-plugins/license */
(function(c){c.fn.visible=function(e){var a=c(this),b=c(window),f=b.scrollTop();b=f+b.height();var d=a.offset().top;a=d+a.height();var g=e===true?a:d;return(e===true?d:a)<=b&&g>=f}})(jQuery);

lazyLoad.coffee

#######################
# Lazy Load
#######################
# Makes use of the visible plugin

win = $(window)
allArticles = $("#article-slider article")
allArticles.each (i, el) ->
    $(el).addClass "already-visible" if $(el).visible(true)

win.scroll (event) ->
    allArticles.each (i, el) ->
        el = $(el)
        if el.visible(true)
            el.addClass "fadeIn"
        else
            el.removeClass "fadeIn already-visible"

Sometimes throw the exceptions that property top is undefined