Nicetit in nascosto div è ridimensionato piccolo

Question

Sto cercando di usare l'editor NECEDIT per una textaa nascosta in un div.Quando l'utente fa clic su un pulsante, il div genitore di Textarea mirato viene rivelato.La larghezza della textarea è impostata sul 100% del genitore div.Il problema è che il div genitore è nascosto in modo che il Textrea non abbia larghezza prima che il div genitore sia rivelato.Se cerco di allegare l'editor NECEDIT contemporaneamente come rivelando il suo genitore Div, l'editor appare piccolo.

<script type="text/javascript">

function add_task_editor() {
        new nicEditor({buttonList : ['fontSize','bold','italic','underline','strikeThrough','subscript','superscript','ul','link']}).panelInstance('task_description');
    };

$('#trigger_it').click(function (e) {
 $('#parent_div').show();
 add_task_editor();

});
</script>
<div id="parent_div" style="display: none;">
<textarea id="task_description"></textarea>
</div>

.

C'è un modo per risolvere ciò in modo che la larghezza dell'editor sia impostata sul 100% del genitore div dopo che è stato caricato?

Answer 1

Naturalmente, fondamentalmente dopo aver creato l'editor, ispezionalo per trovare l'ID o una classe ha, e impostare la sua larghezza $('#editorsID').width('100%'); ad esempio.

o forse trovare è la larghezza del genitore div in pixel e impostalo in questo.

Answer 2

Nel mio caso funzionava con JQuery:

new nicEditor().panelInstance('myArea');

$('.nicEdit-panelContain').parent().width('100%');
$('.nicEdit-panelContain').parent().next().width('100%');

.

o alla larghezza assoluta:

$('.nicEdit-panelContain').parent().width('400px');
$('.nicEdit-panelContain').parent().next().width('400px');

.

Answer 3

La risposta di @hans ha lavorato con me ... ma avevo bisogno di aggiungere anche questo per ridimensionare il div contenente il testo che viene modificato (solo il contenitore attorno a quel div è stato ridimensionato quando non si utilizza la riga qui sotto): .

$('.nicEdit-main').width('100%');

.

Answer 4

$('.nicEdit-panelContain').parent().width('100%');
$('.nicEdit-panelContain').parent().next()
    .width($('.nicEdit-panelContain').parent().width()-2);

.

Aggiungi "-2" a "larghezza" se il genitore di TextArea ha PROP "Imbottitura-sinistra" o "Imbottitura-destra".

Answer 5

Questo ha funzionato meglio per me:

new nicEditor().panelInstance('nic-me');
$('.nicEdit-panelContain').parent().width('100%');
$('.nicEdit-panelContain').parent().next().width('98%');
$('.nicEdit-main').width('100%');

.

Answer 6

Questo risolve il mio caso! Grazie

$(document).ready(function(){
        bkLib.onDomLoaded(function() {
        new nicEditor({fullPanel : true, maxHeight:100}).panelInstance('myArea');
        $('.nicEdit-panelContain').parent().width('100%');
        $('.nicEdit-panelContain').parent().next().width('98%');
        $('.nicEdit-main').width('100%');
        });
    });

.

Answer 7

Per coloro che hanno lo stesso problema, l'ho ottimizzato e sembra completamente normale:

$(document).ready(function(){
    bkLib.onDomLoaded(function() {
        new nicEditor({fullPanel : true}).panelInstance('myArea');
        $('.nicEdit-panelContain').parent().css({width:'100%', padding:"0"});
        $('.nicEdit-panelContain').parent().next().css({width:'100%', padding:"5px"});
        $('.nicEdit-main').css({width:'100%', padding:"0", minHeight:"80px"});
    });
});

.