Cufon несколько шрифтов - как? - PullRequest
Новая
       5

Cufon несколько шрифтов - как?

5 голосов
/ 06 мая 2010

Я пытаюсь внедрить 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 - это именно тот файл?

заранее спасибо

Ответы [ 5 ]

9 голосов
/ 27 мая 2011

Это очень просто, предположим, что вы используете 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>
7 голосов
/ 06 мая 2010

Он знает, потому что ваш Vegur_300.font.js файл содержит команду Cufon.registerFont, которая содержит параметр объекта font-family (в face).

Пока все ваши файлы шрифтов .js выполняются, Cufon получает регистрационную информацию с данными кривой для каждого шрифта. Что касается того, почему это не работает для вас, я не могу спекулировать без дополнительной информации. У вас есть пример сайта?

0 голосов
/ 09 октября 2012

См: 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>
0 голосов
/ 28 сентября 2012

Когда вы генерируете свой шрифт Cufon на их веб-сайте , вы указываете имя, которое будет использоваться для вашего шрифта.

Использовать следующее значение в качестве семейства шрифтов сгенерированного шрифта (необязательно)

Вы должны использовать это имя при вызове Cufon, иначе оно не будет работать должным образом. Я думаю, что это может быть причиной того, что замена вашего шрифта не работает. Именно так Cufon знает, на какой шрифт вы ссылаетесь, когда делаете вызов fontFamily.

0 голосов
/ 30 ноября 2010 
<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>

Это сработало для меня.

...