Jquery masonry 如何使用jquery创建多个容器

我在我的网站上设置了一个标签，我想在每个标签的内容上使用砖石，但我一次只能在一个标签上工作

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

<!--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
});
});});

$（文档）.ready（函数（）{
$（窗口）。加载（函数（）{
var$container=$（“#container”）；
var$container=$（“#dinning”）；
var$container=$（“#事件”）；
var$container=$（“#爬升”）；
var$container=$（“#野生动物”）；
var$container=$（“#购物”）；
var$container=$（“#kids”）；
var$container=$（“#sport”）；
$container.com({
itemSelector:“.item”，
排水沟宽度：10，
我说：！现代化
});
});});

---

但这也不行。我相信这是一件简单的事情，但我的JavaScript代码并不太好。我猜对了（

我认为这更多的是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上，并在其上添加该类

---

如果没有JSFIDLE中的一些标记或示例，我们就无法真正帮助您了。

我认为这在某种程度上可以解释如何做到这一点。虽然我将多次使用它，但我想知道是否有任何方法可以减少生成的多余代码。希望这对其他人有所帮助。干杯，以上评论在一定程度上有效xtent。上述注释在一定程度上起作用。我仍然对选项卡有问题。虽然现在我可以创建不同的容器，但砌体仅在最初加载的选项卡上起作用。如果单击其他选项卡，则会将div加载到彼此的顶部，尽管如果调整浏览器窗口的大小，会触发砌体JQuery和divs幻灯片到位。任何帮助都会很棒。这让我发疯！