TYPEFACE.JS Selecting different fonts

I'm trying to create a font preview form like on dafont.com or a similar website using typeface.js.

I'm having trouble getting typeface.js to render font for anything 开发者_Python百科but a heading tag. Further, how can I choose which font to use from a dropdown?

Thanks SO much!

---

Have you read the documentation?

Have you converted your fonts for use with typeface?

From the Typeface website:

By default typeface.js will render text for heading elements (h1, h2, etc.) when those elements' styles reference typeface.js fonts.

Remember that heading styles are bold by default, so you'll either need to add font-weight: normal to you heading styles, or load the bold version of the font if that's what you're after.

Any other HTML element referencing a typeface.js font needs to have typeface-js in its list of class names. If you have an element that already has a class name, for example, , you can just add another class name by saying .

You'll have to load external stylesheets before loading typeface.js. Otherwise, Firefox 3 might not have applied the styles when typeface.js tries to draw the text.

Unfortunately, specifying the font-stretch property will only work with inline CSS and not from any stylesheet.

In some circumstances in IE7 you may see a couple of milliseconds' delay before the browser shows typeface.js text after the page is rendered, producing a "flicker" effect. One way to get around this is to manually put a call to _typeface_js.initialize() just before your closing tag.

---

If your looking to dynamicly change the font displayed in a single canvas, you would probably have to read the documentation for typeface.js and see if there is some way to do that, there is also a forum on the typeface website. Otherwise you would have to write something yourself that interacts with the typeface script to change the displayed font.