Skip to content

Instantly share code, notes, and snippets.

@rbk
Last active September 9, 2015 21:26
Show Gist options
  • Save rbk/a025bf3ab60f5e9574bc to your computer and use it in GitHub Desktop.
Save rbk/a025bf3ab60f5e9574bc to your computer and use it in GitHub Desktop.
Inner grid. Grid border is never on the outside.
function set_grid_borders( ){
var grid = $('.brand-grid');
if( grid.length ){
var grid_w = grid.width();
var grid_h = grid.height();
var grid_items = grid.find('.item');
var item_width = grid_items.innerWidth();
var item_height = grid_items.innerHeight();
var cols = Math.round(grid_w/item_width);
var rows = grid_items.length / cols;
// If last row is not complete.
if( rows % 1 != 0 ) {
rows = Math.floor( rows ) + 1;
}
var item_offset = rows * cols - grid_items.length;
item_offset = cols - item_offset ;
grid_items.css({
'border':'1px solid #dadada',
'border-top-color' : 'transparent',
'border-left-color' : 'transparent'
});
grid.find('.item:nth-last-child(-n+'+item_offset+')').css({
'border-bottom-color' : 'transparent'
});
grid.find('.item:nth-child('+cols+'n)').css({
'border-right-color' : 'transparent'
});
if( rows == 1 ){
grid.find('.item:last-child').css({
'border-right-color' : 'transparent'
});
}
}
console.log( 'columns:' + cols );
console.log( 'rows:' + rows );
console.log( 'offset:' + item_offset );
}
set_grid_borders( );
$(window).resize(function(){
set_grid_borders();
});
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment