FontLoader 不工作 - 没有字体被加载答案

【问题标题】：FontLoader Not Working - No Fonts Get LoadedFontLoader 不工作 - 没有字体被加载
【发布时间】：2023-04-03 11:14:01
【问题描述】：

我正在使用这里的字体加载器：https://github.com/smnh/FontLoader 如果你知道的话，请推荐一个更好的。

问题是没有字体被加载。字体加载器总是出现错误未加载所有字体。

我已经减少到一个单一的字体，它只是不工作。所有字体文件的 URL 都是正确的，我可以在我的浏览器中下载它们。

CSS：

<script type="text/css">
    @font-face{
        font-family:'MrsSaintDelafield';
        src: url('https://example.com/wp-content/themes/utterly/designer/fonts/Used/MrsSaintDelafield-Regular.eot');
        src: url('https://example.com/wp-content/themes/utterly/designer/fonts/Used/MrsSaintDelafield-Regular.eot?#iefix') format('embedded-opentype'),
        url('https://example.com/wp-content/themes/utterly/designer/fonts/Used/MrsSaintDelafield-Regular.woff2') format('woff2'),
        url('https://example.com/wp-content/themes/utterly/designer/fonts/Used/MrsSaintDelafield-Regular.woff') format('woff'),
        url('https://example.com/wp-content/themes/utterly/designer/fonts/Used/MrsSaintDelafield-Regular.ttf') format('truetype'),
        url('https://example.com/wp-content/themes/utterly/designer/fonts/Used/MrsSaintDelafield-Regular.svg') format('svg');
    }
</script>

JS：

// wait for document load
    jQuery(document).ready(function($) {

        // wait for all fonts to be loaded before doing anything else
        var fontLoader = new FontLoader(["MrsSaintDelafield"], {
            "fontLoaded": function (font) {
                console.log("font has loaded " + font.family);
            },
            "complete": function (error) {
                if (error != null) {

                    console.log(error.message);

                } else {

                }
            }
        },3000);

        fontLoader.loadFonts();
    });

我在控制台中得到的只是：“并非所有字体都已加载 (0/1)”

还有其他人遇到过这个问题吗？

【问题讨论】：

标签： css font-face

【解决方案1】：

这似乎只是为了加载字体。看起来这种字体可以通过谷歌字体获得。按照link 并单击“选择此字体”以获取有关如何将其添加到您的网站的说明。

【讨论】：