无法在tumblr上实现mansory布局+无限滚动

Question

我已经沮丧了好几个星期，但却无法弄清楚我的模板有什么问题。我使用了很多方法来创建mansory布局（2列帖子），但我在大多数方法上都失败了。这是我第一次尝试使用java脚本而且我开始相信我的html / css失败了，或者只是因为我对js挑战不够好...... 这是我的tumblr http://thegreysanctuary.com/

<script>
(function () {
var $tumblelog = $('#container');
$tumblelog.infinitescroll({
    navSelector: ".pagination",
    nextSelector: ".pagination a:jump_page",
    itemSelector: ".item",
},

function (newElements) {
    var $newElems = $(newElements).css({
        opacity: 0
    });
    $newElems.imagesLoaded(function () {
        $newElems.animate({
            opacity: 1
        });
        $tumblelog.masonry('appended', $newElems);
    });
});
$tumblelog.imagesLoaded(function () {
    $tumblelog.masonry({
        columnWidth: function (containerWidth) {
            return containerWidth / 100;
        }
    });
 });
})();

</script>

HTML5 ------------------------------
img {
height: auto;
width: auto;
}

#container {
width: 960px;
margin: 30px auto 30px auto;
padding: 0px 0px 0px 0px;
clear:both;



}

.mansory {
width:auto;
border-width: 1px;
border-color: #fff;
border-style: solid;
}

.item{


width: 400px;
margin: 10px 20px 0px 10px;
border-width: 8px;
border-color: #fff;
border-style: solid;
background-color: #fff;
 border-radius: 5px;
-o-border-radius: 5px;
-moz-border-radius: 5px;
-webkit-border-radius: 5px; 
 float: left;
color: #73654D;
display: inline-block;
}

.pagination {
margin: 20px auto 0px auto;
padding: 10px 0px 10px 0px;
clear: both;
visibility:hidden;
}