Question

我在我的网站上设置了标签，我想在每个标签的内容上使用Masonry，但我一次只能在1个标签上使用它。

最初我尝试使用通用选择器并在每个选项卡中使用它。然而，这仅适用于第一个选项卡。然后我尝试添加更多容器变量：

<!--Masonry kit-->
<script type="text/javascript" src="http://localhost/LazyDuck/masonry-site/js/jquery.masonry.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$(window).load(function() {

var $container = $('#container');
var $container = $('#dining');
var $container = $('#events');
var $container = $('#climbing');
var $container = $('#wildlife');
var $container = $('#shopping');
var $container = $('#kids');
var $container = $('#sport');


$container.masonry({
  itemSelector: '.item',
  gutterWidth : 10,
  isAnimated: !Modernizr.csstransitions
});
});});

但这也不起作用。我确信这是一件简单的事情，但我的JavaScript编码并不是那么好。我猜到了上面的情况。：（

Answer 1

我认为它更多是jQUery语法，但我认为如果没有可见内容，砌体将无法工作。它必须应用于可见的div。

所以一种方法是在它可见的同时完成所有操作然后隐藏它......不是很好......我知道。

var $container = $('#container');
var $container = $('#dining');
var $container = $('#events');
var $container = $('#climbing');
var $container = $('#wildlife');

要解决启动插件的链条问题，请执行此操作

$('#wildlife, #climbing , ... ,#container).masonry({ ..

但在这种情况下，通过uniqe类名称（例如

）来切换它会更容易

class="MasoniseThis otherClasses"
...
$('.MasoniseThis').masonry({ ..

在每个页面加载上，它应该将插件应用于任何带有该类的可见div。

如果没有JSFiddle中的一些标记器示例，我们就无法再为您提供帮助了。

如何使用jquery砌体获得多个容器

1 个答案: