Cufon not working with IE9. How to fix it?

No picture found

Info:
Posted in: Learned along the way
By: Blockcoder ( Admin ) / October 9th, 2011
Stats: 13 responses / Views: 1,401

A short answer

This is again one of my short answers to many problems. I’m sharing these because I want to help others who are somehow ended up fighting with these hitches. You can get the solutions here by reading couple of lines or you can continue fighting by yourself and waste your working hours.

Internet Explorer 9 and the Cufon problem

Cufon is a great tool. With it you can render your favourite fonts with JavaScript engine. “Cufon” arconym comes from words custom font(s). It’s named like that because you can render any of your ( custom ) fonts on your website with JavaScript. If you turn JavaScript off, Cufons won’t be rendered.

The problem comes when you develop sites with the newest version of Internet Explorer ( IE9 ), you should have noticed that Cufons are not working with it. It’s weird because Cufons are working with earlier versions of IE. It must have something to do with the rendering engine of new IE, it’s rendering things somehow differently or it just leaves something out. But let’s stop talking and move on.

The solution

For consolation, there are at least one solution for this ( I have used this ):

Update your Cufon to its newest version
Write the code below into your head-tag just before your js-file(s):

  <!--[if gte IE 9]>
    <script type="text/javascript">
      Cufon.set('engine', 'canvas');
    </script>
  <meta http-equiv="X-UA-Compatible" content="IE=8" />
  <![endif]-->

Like this for example:


<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<meta name="description" content="Site description">

<title> Your site title.. </title>

<link rel="stylesheet" href="css/style.css" type="text/css" media="screen" />
<link rel="stylesheet" href="js/fancybox/jquery.fancybox-1.3.1.css" type="text/css" media="screen" />
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<script type="text/javascript" src="js/fancybox/jquery.fancybox-1.3.1.js"></script>
<script type="text/javascript" src="js/cufon.js"></script>

  <!--[if gte IE 9]>
    <script type="text/javascript">
      Cufon.set('engine', 'canvas');
    </script>
  <meta http-equiv="X-UA-Compatible" content="IE=8" />
  <![endif]-->

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

Save your header file and refresh the IE. Everytime I have used that, it has worked really well. I do not doubt that it ain’t working on your website!

But that was really it, thanks again for reading.

There are 13 responses on this post

Aguitta

Worked like a charm. Thanks!. (The Link to update to the latest version of cufon, gave me a couple of warnings, as luck will have it, I did not need to update, but FYI.). Cheers, Aguitta

花蓮旅遊

Whats up ! Love your , thanks for sharing it with everyone

www.Archos.com/register2/login.html

Great content, looking forward to tomorrow's update!

www.iTunes.com/download

I'm so lucky to have discovered this blog page. You much told me exactly what I chose to hear and then some. Beautiful publication and cheers again for doing this no cost ! ! .

iphone 5 specs

I would like to thnkx with the efforts you've set in composing this web site. I'm hoping the same high-grade web site article from you in the upcoming as well. In fact your creative creating abilities has inspired me to obtain my own website now. Actually the running a blog is spreading its wings quickly. Your write up is actually a excellent example of it.

how many calories should i eat

Wow, awesome post, I was wondering the same thing. and found your site by bing, many userful stuff here, now i’m a bit clear. bookmarked and also signed up your rss. keep us updated.

Free Steam Keys

Such an amazing blog, favourited.

Blockcoder ( Admin )

Thank you very much for the comments! :)

cheap web design

Thank you for posting this! Exactly what I've been looking for. Great details!

Web Pages

Clueless

Roberto Kalinger

Thankyou so much for this interesting blog post, worth a read.

custom web design

Intresting website! I will for sure drop by it more often!