如何使用加载的图像向同位素添加砌体选项

Question

使用Jquery Isotope和图片加载选项时，我遇到了firefox和chrome无法呈现适当数量列的问题。 Safari始终显示3列。然而，firefox和chrome有时只显示2.我的所有图像都具有相同的宽度28.333％。我已经尝试将其更改为较低的数字，但它不会产生任何影响。

以下是我目前的情况：

$(document).ready(function() {  
 var $container = $('#artContent'),
 filters = {};

$container.imagesLoaded( function(){
$container.isotope({
itemSelector : '.isotopeItem'
});
});

我试过这个导致破坏所有jQuery

$(document).ready(function() {  
 var $container = $('#artContent'),
 filters = {};

$container.imagesLoaded( function(){
$container.isotope({
itemSelector : '.isotopeItem',
masonry: { columnWidth: 33.333% }

});
});

还有其他人有这个问题吗？或者知道如何解决它。

Answer 1

如果您在columnWidth中使用％，则需要如此（请注意单引号）：

$(document).ready(function() {  
 var $container = $('#artContent'),
 filters = {};

$container.imagesLoaded( function(){
$container.isotope({
itemSelector : '.isotopeItem',
masonry: { columnWidth: '33.333%' }

});
});