0

我只使用同位素网站提供的默认代码。该插件工作正常,它在页面上就好了。默认情况下,不指定列宽和装订线宽度,isotope 会在元素之间自动应用 7px 边距。但是,我想减少此边距并尝试按照文档的指示传递列宽和装订线宽度,但我总是失败。代码是:

$container.isotope({
     itemSelector: '.gallery-item',
     masonry : {
        columnWidth: 300, 
        gutterWidth: 2
               }
});

没有实时网址可以查看,但您可以在这里查看,我所做的只是创建“官方”jsfiddle 的副本,然后添加列宽和装订线宽度。您可以看到,虽然框的宽度和高度为 70 像素,但它无法正常工作,除非有我不明白的地方..

http://jsfiddle.net/PUhtY/

谢谢!

4

2 回答 2

1

如果您仍在寻找答案,您将需要 jQuery Gutter Width Extension。

https://gist.github.com/Huskie/2574891

在你的同位素功能之外敲打它,你应该准备好了!我有同样的问题,它对我有用。

于 2013-02-07T21:39:36.477 回答
1

您的问题是您使用guuterWidth而不是gutter.

将您的代码更改为以下内容:

$container.isotope({
 itemSelector: '.gallery-item',
 masonry : {
    columnWidth: 300, 
    gutter: 2
    }
});
于 2017-09-26T12:30:39.077 回答