@ -13,6 +13,8 @@ Most layout modes (i.e masonry, fitRows) need to measure the size of each item t
### Images
### Images
#### Inline dimensions
For images, the best method is to specify the width and height of images inline.
For images, the best method is to specify the width and height of images inline.
{% highlight html %}
{% highlight html %}
@ -23,6 +25,22 @@ For images, the best method is to specify the width and height of images inline.
If you’re using a PHP-based CMS, you can use the [getimagesize](http://php.net/manual/en/function.getimagesize.php) function.
If you’re using a PHP-based CMS, you can use the [getimagesize](http://php.net/manual/en/function.getimagesize.php) function.
#### imagesLoaded plugin
The next best solution is to use the imagesLoaded plugin included with Isotope. It's a fork of [Paul Irish's plugin](https://gist.github.com/268257) that finds all the images in a context, and fires a callback function once all the images have loaded.
{% highlight javascript %}
$('#container').imagesLoaded( function(){
$(this).isotope({
itemSelector : '.item',
});
});
{% endhighlight %}
#### `$(window).load()`
Another solution is to initialize Isotope inside `$(window).load()` instead of `$(document).ready()`.
Another solution is to initialize Isotope inside `$(window).load()` instead of `$(document).ready()`.