Instafeed Infinite Scroll

Instagram feed with infinite scrolling functionality

HTML

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css">
<script src="http://instafeedjs.com/js/instafeed.min.js"></script>
<div class="container">
    <div class="row">
        <div id="insta-photos" class="insta-photos"></div>
    </div>
</div>

CSS

.no-padding {
    padding: 0 !important;
    margin: 0 !important;
}

.img-thumbnail
{
    border-radius:0;
}

JavaScript

var feedOnGallery = new Instafeed({
    get: 'tagged',
    limit: 20,
    tagName: 'Tesla',
    clientId: '21eb5beef3a24aaeb08c7c2c5c885efb',
    sortBy: 'most-recent',
    template: '<div class="col-xs-4 no-padding"><a href="{{model.images.standard_resolution.url}}"><img src="{{image}}" class="img-responsive img-thumbnail"/></a></div>',
    resolution: 'low_resolution',
    target: 'insta-photos',
    after: function () {

    }
});

feedOnGallery.run();

$(window).on('scroll', function () {
    var windowScrollTop = $(window).scrollTop();
    var instafeedContainer = $("#insta-photos");
    var instafeedContainerInnerHeight = instafeedContainer.innerHeight();
    var thresholdValue = 520;

    if (instafeedContainerInnerHeight - windowScrollTop <= thresholdValue) {
        if (feedOnGallery.hasNext()) {
            feedOnGallery.next();
        }
    }
});