I have a been working on a rich-text editor for a web app we are writing and have come across an issue with designMode. Basically, if I document.write a <link> tag in, for a stylesheet, Firefox renders the stylesheet but will not switch to design mode. This approach works in IE6/7 (basic snippet below):
[CODE]
// SNIPPED…
this.SetFrameHtml = function(html)
{
var editDoc = this.GetDocument();
if (!Compatibility.IsNull(editDoc))
{
this.frameObject.src = ‘about:blank’;
editDoc.open();
editDoc.write(‘<html><head>’);
if (!Compatibility.IsNull(this.cssFile) && this.cssFile != ”)
editDoc.write(‘<link rel=”stylesheet” type=”text/css” media=”all” href=”‘ + this.cssFile + ‘” />’);
editDoc.write(‘</head><body>’);
editDoc.write(html);
editDoc.write(‘</body></html>’);
editDoc.close();
}
if (!Compatibility.IsNull(this.inputObject))
this.inputObject.value = html;
}
// …SNIPPED…
this.cssFile = cssFile;
this.SetFrameHtml(this.initHtml);
this.GetDocument().designMode = ‘on’;
// …SNIPPED
If this.cssFile is null or empty, it will work in IE and FF, but if cssFile is populated, the mode never switches.
Does anyone have any ideas why?
J.