J'essaie d'utiliser l'éditeur Niceicit pour un Texarea caché dans une DIV. Lorsque l'utilisateur clique sur un bouton, le parent divisé par Textarea ciblé est révélé. La largeur de la textarea est définie à 100% du parent div. Le problème est que le parent div est caché de sorte que la textrea n'a pas de largeur avant que le parent div ne soit révélé. Si j'essaie de joindre l'éditeur Nicedidit en même temps que de révéler son parent div, l'éditeur apparaît minuscule.
<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>
8 Réponses :
Bien sûr, fondamentalement après la création de l'éditeur, inspectez-le pour trouver son identifiant ou une classe IT, et définir sa largeur ou peut-être trouver la largeur de Sail Div en pixels et la définir à cela. $ ('# éditorsid'). Largeur ('100%'); par exemple.
Dans mon cas, cela a fonctionné avec jQuery: ou à absolu witdh:
La réponse de @hans a travaillé avec moi ... Mais je devais ajouter cela aussi pour redimensionner la DIV contenant le texte édité (seul le conteneur autour de cette DIV a été redimensionné lorsque vous n'utilisez pas la ligne ci-dessous): < Pré> xxx
$('.nicEdit-panelContain').parent().width('100%');
$('.nicEdit-panelContain').parent().next()
.width($('.nicEdit-panelContain').parent().width()-2);
Add "-2" to "width" if parent of textarea has prop "padding-left" or "padding-right".
Cela a fonctionné le mieux pour moi:
Cela résolvez mon cas!
Merci
Pour ceux qui ont le même problème, j'ai optimisé cela et il semble complètement normal:
Après avoir essayé de multiples choses sur le panneau redimensionnement. Ceci a fonctionné pour moi ..
bkLib.onDomLoaded(function() {
new nicEditor().panelInstance('textarea_id');
document.querySelector('div[unselectable="on"]').setAttribute('style', '');
});