Skip to content

Instantly share code, notes, and snippets.

@ignacioricci
Created August 28, 2012 21:53
Show Gist options
  • Save ignacioricci/3504676 to your computer and use it in GitHub Desktop.
Save ignacioricci/3504676 to your computer and use it in GitHub Desktop.
Lightweight Pinterest Column JS (Jquery)
var colCount = 0;
var colWidth = 0;
var margin = 20;
var windowWidth = 0;
var blocks = [];
$(function(){
$(window).resize(setupBlocks);
});
function setupBlocks() {
windowWidth = $(window).width();
colWidth = $('.block').outerWidth();
blocks = [];
console.log(blocks);
colCount = Math.floor(windowWidth/(colWidth+margin*2));
for(var i=0;i<colCount;i++){
blocks.push(margin);
}
positionBlocks();
}
function positionBlocks() {
$('.block').each(function(){
var min = Array.min(blocks);
var index = $.inArray(min, blocks);
var leftPos = margin+(index*(colWidth+margin));
$(this).css({
'left':leftPos+'px',
'top':min+'px'
});
blocks[index] = min+$(this).outerHeight()+margin;
});
}
// Function to get the Min value in Array
Array.min = function(array) {
return Math.min.apply(Math, array);
};
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment