Javascript 同位素初始化赢得'；不行。添加slick.js carousel插件后出现图像问题

我已经使用Desandro的同位素.js创建了一个网格，在我添加我选择的旋转木马插件之前，它运行良好

现在，在加载时，我放在旋转木马中的图像似乎在同位素的.item容器外作为块，这留下了一个间隙，使网格混乱。当我从Firefox中按下响应视图时，网格似乎重新洗牌，并再次显示网格的正确位置

所以我想可能是在脚本的初始化中。在slick.js初始化之后，我尝试将同位素脚本放在底部，但没有效果。当我尝试$（document）.ready函数时，同位素将不再工作

在

.carousel项目上将高度从自动更改为固定高度可以消除间隙，但问题是我使同位素响应，因此当在其他大小的屏幕上查看时，网格不再相等（旋转项目的高度小于网格的其余部分，使网格在较小的屏幕上不均匀）

我的HTML是这样的：

<div id="container">
    <div class="grid-sizer"></div>
    <div class="gutter-sizer"></div>

    <div class="item h2 w3">
        <div class="carousel-item">
          <div><img src="http://placeholdit.300x300"></div>
          <div><img src="http://placeholdit.300x300"></div>
          <div><img src="http://placeholdit.300x300"></div>
        </div>
    </div>

    <div class="item h2"></div>
    <div class="item w3"></div>
    <div class="item w2"></div>
</div>

我试图在谷歌搜索同位素初始化后添加这个，但同位素根本不适用于这个脚本

$(document).ready({
  $container.imagesLoaded( function() {
    $container.isotope({
      // options
      masonry: {
        columnWidth: '.grid-sizer',
        gutter: '.gutter-sizer'
      },
      itemSelector: '.item'
    })
  }
})

这也不行

 var $container = $('#container').imagesLoaded( function() {
    $container.isotope({
     // options
     masonry: {
       columnWidth: '.grid-sizer',
       gutter: '.gutter-sizer'
     },
     itemSelector: '.item'
    });
  });

我用这个：

    var $container = $('.l-grid').imagesLoaded( function() {
        $container.isotope({
            itemSelector: '.block',
            gutter: 0,
            transitionDuration: 0,
            layoutMode: 'packery'
        });
    });

这对我很有用。
在同位素初始化之前试着运行你的光滑代码

    var $container = $('.l-grid').imagesLoaded( function() {
        $container.isotope({
            itemSelector: '.block',
            gutter: 0,
            transitionDuration: 0,
            layoutMode: 'packery'
        });
    });