Search code examples
javascripthtmlcufon

Cufon console error, not replacing font. (ReferenceError: Can't find variable: Cufon)

My first attempt at using Cufon has caused me a few problems as I just can't seem to get it to work. The Coda's Javascript log is giving me this error (ReferenceError: Can't find variable: Cufon) From a few tutorials I have followed them precisely have been back and forth downloading the libraries over and over and nothing is working. If you guys could have a look and help me out, it would be much appreciated.

Here is my code;

    <!DOCTYPE html>
    <html lang="en">
    <head>
    <title>Test</title>
    <!-- Styles go here -->
    <link rel="stylesheet" type="text/css" href="css/reset.css" />
    <link rel="stylesheet" href="css/style.css" />
    <!-- End styles here -->

    <!-- Scripts go here -->
    <!--[if lt IE 9]>
    <script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
    <![endif]-->
    <script type="text/javascript" src="scripts/A.font.js"></script>
    <script type="text/javascript" src="scripts/cufon.js"></script>

    <script type="text/javascript">
        Cufon.replace("p");
    </script>
    <!-- Scripts end here -->
</head>

<body>

<p>Test</p>
Test

</body>
</html>

Thanks.

Solution

  • This error occurred because you've loaded Cufon after the font has been loaded that requires it, so try to change the order, first load the cufon.js

    <script type="text/javascript" src="scripts/cufon.js"></script>

    and then load the A.font.js

    <script type="text/javascript" src="scripts/A.font.js"></script>