Question

What I should add to this script for running in head. When I put in the end of body it run well. I think this is due to the fact that the script starts before images are loaded. Example http://masonry.desandro.com/docs/intro.html

<script>var $container = $('#container');
$container.imagesLoaded(function(){
$container.masonry({
itemSelector : '.item',
columnWidth : 300 
 });
});
</script>

Answer 1

The body (also the container) doesn’t exist when the code will be executed. In the head you should wrap your code in a $(document).ready(function() { ... });:

<script>
$(document).ready(function() {
    var $container = $('#container');
    $container.imagesLoaded(function(){
        $container.masonry({
            itemSelector : '.item',
            columnWidth : 300 
        });
    });
});
</script>