Question

我有一个名为slabtext的插件，我想在我的字体被完全加载后才能运行。我尝试了以下但它不起作用（可能是在关闭正文之前的脚本中的错误）。有没有一种简单的方法来运行Slabtext脚本只有在字体完全加载后，我已经尝试了$（document）.ready（function（），但它没有帮助

<head>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script src="//ajax.googleapis.com/ajax/libs/webfont/1.4.7/webfont.js"></script>
<script>
    WebFont.load({
        google: {
            families: ['Roboto:300', 'Roboto+Slab:400']
        }
    });
</script>
<script src="//cdnjs.cloudflare.com/ajax/libs/slabText/2.3/jquery.slabtext.js"></script>
</head>

<body>
    <h1 id="mainhead">
        <span class="slabtext">For one night only</span>
        <span class="slabtext">Jackie Mittoo</span>
        <span class="slabtext">with special Studio One guests</span>
        <span class="slabtext">Dillinger &amp; Lone Ranger</span>
    </h1>
...
<script>
    WebFont.load({
        active: function() {
            $('#mainhead').slabText();
        }
    })
</script>
</body>

当所有字体加载完毕后，webFontLoader还会将类.wf-active添加到html元素中，如果有任何帮助的话。

Answer 1

在同一个WebFont-load（）事件中调用“google”和“active”对我有用：

<script>
  WebFont.load({
    google: {
      families: ['Roboto:300', 'Roboto+Slab:400']
    },
    active: function() {
      $('#mainhead').slabText();
    }
  });
</script>

使用WebFontLoader在所有字体完全加载后运行插件

1 个答案: