Question

Je suis en train d'utiliser le NicEdit éditeur pour un textarea caché dans un div.Lorsque l'utilisateur clique sur un bouton, la cible textarea du div parent est révélé.La largeur de la zone de texte est définie sur 100% de la div parent.Le problème est que la div parent est masqué si le textrea n'a pas de largeur avant de la div parent est révélé.Si je tente de joindre le NicEdit éditeur en même temps que révéler la div parent, l'éditeur semble 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>

Est-il un moyen de résoudre ce problème de manière que le rédacteur en chef de la largeur est fixée à 100% de la div parent après il est chargé?

Était-ce utile?

La solution

Bien sûr, au fond après l'éditeur est créé, l'inspecter pour trouver l'ID ou une classe qu'il a, et de l'ensemble de la largeur $('#editorsID').width('100%'); par exemple.

Ou peut-être trouver du div parent de la largeur en pixels et définissez-la à qui.

Autres conseils

Dans mon cas, cela a travaillé avec jQuery:

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

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

ou à la largeur absolue:

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

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é lorsqu'il n'utilise pas la ligne ci-dessous):

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

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

Ajouter "-2" à "Largeur" si le parent de Textarea a accumulé "Rading-gauche" ou "Padding-droite".

Cela a fonctionné le mieux pour moi:

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

Cela résolvez mon cas! Merci

$(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%');
        });
    });

Pour ceux qui ont le même problème, j'ai optimisé cela et il semble complètement normal:

$(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"});
    });
});

Licencié sous: CC-BY-SA avec attribution
Non affilié à StackOverflow
scroll top