Search code examples
javascripthtmlcssiframefont-family

Font-family iFrame body

I've got an iFrame inside a body tag as follows:

<body onLoad="iFrameOn();">
    <iframe name="richTextField" id="richTextField" style="border:#000 1px solid; width:700px; height:300px;"></iframe>
</body>

The javascript iFrameOn looks like this:

function iFrameOn() {
    richTextField.document.designMode = 'On';
    richTextField.document.body.style.fontFamily = "Open Sans","Helvetica Neue",Helvetica,Arial,sans-serif;
}

Unfortunately, the font doesn't change to the font I tell it to change to. The error console from the javascript says: "Helvetica is not defined(...)". How can I solve this, so the font in the iFrame is the one I declare it to be?

Thanks in advance!

Solution

  • you should set them as one string,

    richTextField.document.body.style.fontFamily = 'Open Sans, Helvetica Neue, Helvetica, Arial, sans-serif';