This project has moved. For the latest updates, please go here.

Width of jHtmlArea before/after hiding parent div

Feb 4, 2010 at 6:15 AM


I've set my jHtmlArea as follows:

<textarea id="post-content" cols="90" rows="10"></textarea>

It is contained inside a div (let's call it '#content') whose CSS display property is set to 'none' initially.

After authentication, '#content' is shown (via the jQuery $('#div-id').show() function), but the jHtmlArea's width is set to 0.

I have created a screenshot and placed here:

What is the best way to handle this issue?

Best regards,

- Peter


Feb 4, 2010 at 1:14 PM
Edited Feb 4, 2010 at 1:14 PM

The following can be used as an interim fix for the issue:

$('.jHtmlArea').css('width', '644px'); // Require for outer frame's width
$('.jHtmlArea').find('iframe').css('width', '640px'); // Should allow for padding based on CSS rules
$('.jHtmlArea').find('iframe').css('height', '200px'); // Required for inner iframe's height

This is obviously fugly, but at least temporarily bandages the problem.




Apr 13, 2010 at 1:44 AM

I've run into the same problem. It seems to only occur if I initialize htmlarea() on an element that's currently not visible (in a parent div with display:none;). If I wait to call htmlarea() until after the underlying textarea is visible then I don't get the problem. I haven't taken a look yet in the source code but maybe it's trying to decide dimensions on the iframe but can't when the underlying textarea isn't visible.