Question

I’m using Cufon to load some nice fonts with javascript.
And, as I have many tags, I use the following instruction to replace all the tags:

Cufon.replace('*', { fontFamily: 'MyFont' });

But, I recently decided to exclude some tag classes from the replacement.
Is there an instruction like:

Cufon.exclude('TheClassToExclude');

?

Answer 1

Using * as a selector is a pretty bad idea. For one, it’s going to take forever to load the page and run the script, as Cufon blocks the browser while it does the drawing. Secondly, your text won’t be visibly selectable, depending on the browser. (At this time, FF3.6 doesn’t show selections on Cufon text)

But to answer your question, you can tell cufon to set on certain classes, just add the classes to the elements you want drawn by Cufon, rather than the other way around.

Cufon.replace('h2.cufon', { fontFamily: 'MyFont' });

Edit:

Just discovered that if you’re using a Javascript library like jQuery, you can use a different selector to exclude elements.

Cufon.replace('h2:not(.nocufon)', { fontFamily: 'MyFont' });

This would replace all of the H2 elements with the Cufon text, except those with the nocufon class.