5

我第一次尝试在同一页面上实现 2 个 cufon 字体。它不工作。

在文档中，这是作为示例提供的：

            <script src="Vegur_300.font.js" type="text/javascript"></script>
    <script src="Myriad_Pro_400.font.js" type="text/javascript"></script>
    <script type="text/javascript">
                    Cufon.replace('h1', { fontFamily: 'Vegur' });
        Cufon.replace('h2', { fontFamily: 'Myriad Pro' });
    </script>

我不明白的是 - fontFamily: 'Vegur ' 和实际的Vegur_300.font.js文件之间的联系是什么？

换句话说，浏览器如何知道“Vegur”是那个特定的文件？

提前致谢

4

5 回答 5

9

它非常简单，假设您使用 2 个字体系列“Segoe UI”和“Bauhaus 93”，然后按如下所示放置脚本： 

<script src="js/cufon-yui.js" type="text/javascript"></script>
<script src="js/Segoe_UI_400.font.js" type="text/javascript"></script>
<script src="js/Bauhaus_93_400.font.js" type="text/javascript"></script>
<script type="text/javascript">
Cufon.replace('h1', { fontFamily: 'Segoe UI' });
Cufon.replace('h2', { fontFamily: 'Bauhaus 93' });     
</script>
于 2011-05-27T09:43:44.977 回答
7

它知道是因为您的Vegur_300.font.js文件包含一个Cufon.registerFont包含font-family对象参数 (in face) 的命令。

只要您的所有字体 .js 文件都在执行，Cufon 就会获取注册信息以及每种字体的曲线数据。至于为什么它对您不起作用，我无法在没有更多信息的情况下推测。你有一个示例网站吗？

于 2010-05-06T01:21:20.797 回答
0 
<script src="Vegur_300.font.js" type="text/javascript"></script>
<script type="text/javascript">
  Cufon.replace('h1');
</script>

<script src="Myriad_Pro_400.font.js" type="text/javascript"></script>
<script type="text/javascript">
  Cufon.replace('h2');
</script>

这对我有用。

于 2010-11-30T19:24:46.327 回答
0

当您在他们的网站上生成您的 Cufon 字体时，您指定了要用于您的字体的名称。

使用以下值作为生成字体的字体系列（可选）

调用 Cufon 时必须使用相同的名称，否则将无法正常工作。我认为这可能是您的字体替换不起作用的原因。这就是当您调用 fontFamily 时，Cufon 知道您所指的字体的方式。

于 2012-09-28T18:57:47.843 回答
0

见： https ://github.com/sorccu/cufon/wiki/usage

使用多种字体

要使用多种字体，您只需指定要使用的字体即可：

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<script src="cufon-yui.js" type="text/javascript"></script>
<script src="Vegur_300.font.js" type="text/javascript"></script>
<script src="Myriad_Pro_400.font.js" type="text/javascript"></script>
<script type="text/javascript">
Cufon.replace('h1', { fontFamily: 'Vegur' });
Cufon.replace('h2', { fontFamily: 'Myriad Pro' });
</script>
</head>
<body>
<h1>This text will be shown in Vegur.</h1>
<h2>This text will be shown in Myriad Pro.</h2>
</body>
</html>
于 2012-10-08T23:41:44.463 回答