jquery-masonry - 使用 jQuery Masonry 重叠问题和 Typekit

Question

我正在使用 masonry和 typekit .因此，我希望布局为 not have overlapping由于图像加载，同时 render the typekit fonts without having the default fonts being shown in a flash when we first load the page .

因此，我需要 javascript 代码来处理这两个问题:重叠砌体中的图像和正确加载 typekit 字体。

我的 javascript 文件中有以下代码可以完美加载砌体，但我无法正确加载 typekit 字体。当网站第一次加载时，它显示默认的 Times New Roman 字体，然后在闪烁后显示 typekit 字体。

如何修改我的 javascript 代码？

  //trigger masonry and typekit
  var $container = $('#wrapper');
  function triggerMasonry() {
    if ( !$container ) {
      return
    }
    $container.imagesLoaded(function(){
      $container.masonry({
        itemSelector : '.box',
        columnWidth : 240
      });
    });
  }

  $(function(){
    $container = $('#wrapper');
    triggerMasonry();
  });

  Typekit.load({
    active: triggerMasonry,
    inactive: triggerMasonry
  });

Answer 1

感谢您提供的代码示例，它确实帮助了我，我只需删除 Typekit 提供的原始 Typekit 加载函数即可解决此问题:

<script type="text/javascript">try{Typekit.load();}catch(e){}</script>

拆除后，我的砖石工作完美无瑕。