This test loads images with position: absolute;, and when they are done loading, positions them next to each other based on their width.

Cloning test checks for premature callback execution in WebKit browsers. It it fails, images will be on top of each other in the upper left corner of their holder. This should never happen :) (You can click on cloned holders to remove them.)


// Call imagesLoaded and position images
holder.imagesLoaded(function( $images, $proper, $broken ){

	var $container = this,
		x = 1;

	$images.each( function() {
		var $this = $(this).css({ left: x });
		x += $this.width() + 1;


Fork me on GitHub