Javascript 当立柱过大并在右侧留下间隙时,砌筑中心

Javascript 当立柱过大并在右侧留下间隙时,砌筑中心,javascript,jquery,jquery-masonry,centering,masonry,Javascript,Jquery,Jquery Masonry,Centering,Masonry,我是javascript新手。我真的只知道html css,在我的新tumblr主题中添加砖石是我想要经历的一个挑战,事实证明这正是一个挑战 我的示例页面: 您可以看到,如果这些列无法填充整个页面,那么砌体网格的右侧将有一个很大的间隙。我想要的是,如果存在间隙,根据窗口大小的宽度设置网格中心 我曾经尝试过用css在.mashine和.entry mashine brick上使用自动边距来破解这个问题,但没有运气 我想这在javascript/jquery中可能是固定的,但我对它太陌生了 <

我是javascript新手。我真的只知道html css,在我的新tumblr主题中添加砖石是我想要经历的一个挑战,事实证明这正是一个挑战

我的示例页面:

您可以看到,如果这些列无法填充整个页面,那么砌体网格的右侧将有一个很大的间隙。我想要的是,如果存在间隙,根据窗口大小的宽度设置网格中心

我曾经尝试过用css在.mashine和.entry mashine brick上使用自动边距来破解这个问题,但没有运气

我想这在javascript/jquery中可能是固定的,但我对它太陌生了

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js">
</script>

<script src="http://static.tumblr.com/6hsqxdt/vmwm2rb4g/infinitescrolling.js">
</script>
<script src="http://static.tumblr.com/6hsqxdt/QBym35odk/jquery.masonry.js"></script>

<script>
$(function(){
var $container = $('#posts');
$container.imagesLoaded(function(){
$container.masonry({
itemSelector: '.entry',
});
});
var container = document.querySelector('#container');
var msnry = new Masonry( container, {
  columnWidth: 250,
  itemSelector: '.entry'
});

$container.infinitescroll({
itemSelector : ".entry",
navSelector : "div.pagination",
nextSelector : ".pagination a#next",
loadingImg : "",
loadingText : "<em></em>",
bufferPx : 10000,
extraScrollPx: 12000,
},
// trigger Masonry as a callback
function( newElements ) {
  var $newElems = $( newElements ).css({ opacity: 0 });
// ensure that images load before adding to masonry layout
$newElems.imagesLoaded(function(){
$newElems.animate({ opacity: 1 });
$container.masonry( 'appended', $newElems, true );
});
}
);
});
</script>

$(函数(){
var$container=$(“#posts”);
$container.imagesLoaded(函数(){
$container.com({
itemSelector:“.entry”,
});
});
var container=document.querySelector(“#container”);
var msnry=新砌体(容器、{
列宽:250,
itemSelector:“.entry”
});
$container.infinites卷({
itemSelector:“.entry”,
导航选择器:“div.pagination”,
下一个选择器:“.分页a#下一个”,
加载img:“”,
加载文本:“”,
bufferPx:10000,
超卷PX:12000,
},
//触发器作为回调
函数(新元素){
var$newElems=$(newElements).css({opacity:0});
//确保在添加到砌体布局之前加载图像
$newElems.imagesLoaded(函数(){
$newElems.animate({opacity:1});
$container.mashing('added',$newElems,true);
});
}
);
});
下面是所有的代码(代码是从一个为其他开发人员打开的主题开发人员那里复制和粘贴的)

提前感谢任何人的帮助