Created
August 9, 2014 20:18
-
-
Save gyrus/7af5713865aa08b844c4 to your computer and use it in GitHub Desktop.
Use jQuery to calculate the heights of each row in a list, and the total number of rows (even if the list items are floated)
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
/** | |
* For a list, calculate how many rows, height of each row | |
* | |
* @param {object} l The list jQuery object | |
* @return {object} | |
*/ | |
function pilau_list_dimensions( l ) { | |
var d = { | |
row_heights: [] | |
}; | |
var lis = l.children( 'li' ); | |
var r = 1; // row | |
var llio; // last li offset | |
var lih; // li height | |
var rh; // row height (highest li) | |
// Go through every li | |
lis.each( function( i ) { | |
var el = jQuery( this ); | |
var elo = el.offset(); | |
var lih = el.outerHeight( true ); | |
if ( typeof llio == 'undefined' ) { | |
// First iteration | |
rh = lih; | |
} else if ( elo.top > llio.top ) { | |
// This element is lower than the last one - we're on a new row | |
r++; | |
d.row_heights.push( rh ); | |
} else { | |
// Pass li height through as new highest li in row? | |
if ( lih > rh ) { | |
rh = lih; | |
} | |
} | |
// Pass this element's offset through | |
llio = elo; | |
}); | |
// And the last row... | |
d.row_heights.push( rh ); | |
// Add total number of rows | |
d.row_count = r; | |
return d; | |
} |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment