jquery - 在砌体集中创建锚链接

Question

我对 Masonry 有一个独特的问题，我希望得到一些帮助。因为我是通过 Typekit 从外部加载字体，所以我必须在 window.load 而不是 document.ready 中包含 Masonry 代码（有必要在 Masonry 加载之前加载字体，因为否则行长不同，所以绝对定位会搞砸来源）。我还需要直接链接到 Masonry 组中的部分（作为页面中的锚点）。将这两件事结合起来的问题是，如果您使用 window.load 则在页面加载时锚点不存在，因此链接会指向 Masonry 部分的顶部，而不是 Masonry 部分中带有链接的特定部分。关于如何纠正这个问题的任何想法？最简单的解决方案是让代码工作而不必求助于 window.load。不幸的是，我无法找到替代方案。任何帮助都是极好的。

Answer 1

1. 使用Typekit 字体事件触发砌体有/没有加载字体
2. 捕获任何散列并使用 $(window).load() 强制滚动到它们

---

var $container;

function triggerMasonry() {
  // don't proceed if doc not ready
  if ( !$container ) {
    return
  }
  $container.masonry({
    // options...
  });
}

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

// trigger masonry after fonts have loaded
Typekit.load({
  active: triggerMasonry,
  inactive: triggerMasonry // triggered in Chrome
});

// catch any hashes and force scroll to them
// resolves Masonry bug
var $window = $(window);

$window.load(function(){
  if ( window.location.hash ) {
    var destination = $( window.location.hash ).offset().top;
    $window.scrollTop( destination );
  }
});