Search code examples
cufon

Cufon multiple fonts - How?

I am trying to implement 2 cufon fonts on the same page for the first time. Its not working.

In the documentation this is provided as an example:

            <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>

The thing I dont understand is - what is the link between fontFamily: 'Vegur' and the actual Vegur_300.font.js file?

In other words, how does the browser know that 'Vegur' is that particular file?

thanks in advance

Solution

  • It knows because your Vegur_300.font.js file contains a Cufon.registerFont command that contains the font-family object parameter (in face).

    As long as all your font .js files are executing, Cufon is getting the registration information with the curve data for each font. As to why it's not working for you, I can't speculate without more information. Do you have a sample site up?