2

我已经阅读了很多关于此的帖子，但没有任何效果！这是正在发生的事情的快速 .gif - http://benadelt.com/tweet-grid.gif

我正在使用 Masonry 并像这样加载脚本：

  $(window).load(function() {
     var container = document.querySelector('.masonry');
     var msnry = new Masonry( container, {
       // options
       columnWidth: '.item',
       itemSelector: '.item',
       transitionDuration: '0.2s'
    });
  });

我在多个页面上的多个元素上使用 .item 类来 Masonrize 各种网格，除了我试图创建嵌入推文网格（引导程序）的网格之外，它们都可以正常工作：

<div class="container">
  <div class="masonry">
    <div class="row">
      <div class="item col-lg-3 col-md-4 col-sm-6 col-xs-12">
        <div class="tweet-box">
          <blockquote class="twitter-tweet" data-conversation="none" lang="en"><p><a href="https://twitter.com/geofeedia">@geofeedia</a> can't wait for the ability to do geo-fenced and hashtag/keyword searches in geofeedia ... get it to us quick ! <a href="https://twitter.com/search?q=%23smem&src=hash">#smem</a></p>— Patrice Cloutier (@patricecloutier) <a href="https://twitter.com/patricecloutier/statuses/368417800307499008">August 16, 2013</a>    </blockquote>
        </div>
      </div>
    </div>
  </div>
</div>

虽然 Masonry 在该网格上工作，但在初始负载时，它的间距不正确。在我调用窗口加载而不是准备好文档之前，这发生在我的其他网格上。

这是一个使用完全相同标记的网格的 .gif，除了网格内部只是文本而不是嵌入的推文：http: //benadelt.com/other-grid.gif

想法？

4

0 回答 0