Вопрос перекрытия масонства

Question

Я пытаюсь использовать масонство Дэвида ДеСандро в своих сообщениях в блоге, и у меня возникла досадная проблема, когда контейнеры перекрываются. Как только я изменяю размер окна браузера, все работает нормально:

<!--The code I placed in my template head section:-->
<script src='http://desandro.github.io/imagesloaded/imagesloaded.pkgd.min.js'/>
<script src='http://masonry.desandro.com/masonry.pkgd.min.js'/>
<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js' type='text/javascript'/>
<b:if cond='data:blog.pageType != &quot;index&quot;'>
<script>
$(document).ready(function(){
    var $container = $(&#39;AJcontainer&#39;);
        $container.imagesLoaded( function() {
        $container.masonry({
            itemSelector: &#39;AJpost&#39;,
            });
    });
    });
</script>
</b:if>



<!--The code in my posts:-->
<div class="js-masonry" id="AJpost">
<div class="AJcontainer"><a href="*.jpg">
<img src="*.jpg" />
<div class="AJsumm">(...)</div></a>
</div>

Я искал решение в последние несколько дней безуспешно:imagesLoaded не похоже на работу, (window).load вместо (document).ready тоже не работает

Это веб-сайт в стадии разработки: http://infinitywashere.blogspot.co.uk/2014/04/sketches-again.html

Любая помощь будет очень высоко ценится!

Answer 1

Возможно проблема с синтаксисом JQuery, попробуйте это:

$(window).load(function(){
    var $container = $('#AJpost');
    $container.imagesLoaded( function() {
        $container.masonry({
            itemSelector: '.AJcontainer'
        });
    });
});

Попробуйте без изображения

$(window).load(function() {  
    var $container = $('#AJpost');
    $container.masonry({
        itemSelector: '.AJcontainer'
    });
});