Ändern TinyMCE Eingabehöhe von Textarea Höhe

Question

Mein Formular verwendet Eingaben und Textareas, von denen ich einige als TinyMCE Elemente hinzugefügt habe. Das Problem besteht darin, dass die Eingaben in die gleiche Größe wie die Textareas konvertiert werden. Ich möchte, dass die Eingaben die gleiche Höhe wie Nicht-TinyMCE-Eingabefelder haben (ich verwende die neueste Version von TinyMCE - 3.5b2).

Zum Beispiel fügt TinyMCE diese Tabelle mit den Eingängen und Textbereichen:

<table role="presentation" id="teaser_tbl" class="mceLayout" cellspacing="0" cellpadding="0" style="width: 590px; height: 100px; ">

Wie kann ich diesen eingebetteten Stil ändern, um die Höhe zu reduzieren, für die Eingänge 30px?

Ich habe auch posted this auf den TinyMCE Foren.

Answer 1

<table role="presentation" id="teaser_tbl" class="mceLayout" cellspacing="0" cellpadding="0" style="width: 590px; height: 100px; "> 

Das ist genau das Element müssen Sie ändern. Tinymce hat die Breite und Höhe init param, aber es gibt einige Fälle, in denen diese Einstellung nicht ausreicht. Da der Editor iframe explizit dieselbe Höhe zugewiesen bekommt, müssen Sie auch den iframe anpassen. Sie müssen anrufen

var new_val = '30px'; 

// adjust table element 
$('#' + 'my_editorid' + '_tbl').css('height', new_val); 

//adjust iframe 
$('#' + 'my_editorid' + '_ifr').css('height', new_val); 

Idealy, sollte dies direkt bei der Editor-Initialisierung erfolgen. So verwenden:

tinyMCE.init({ 
    ... 
    setup : function(ed) { 
     ed.onInit.add(function(ed, evt) { 

     var new_val = '30px'; 

     // adjust table element 
     $('#' + ed.id + '_tbl').css('height', new_val); 

     //adjust iframe 
     $('#' + ed.id + '_ifr').css('height', new_val); 
     }); 
    } 
}); 

Update: Lösung ohne jQuery:

tinyMCE.init({ 
    ... 
    setup : function(ed) { 
     ed.onInit.add(function(ed, evt) { 

      var new_val = '30px'; 

      // adjust table element 
      var elem = document.getElementById(ed.id + '_tbl'); 
      elem.style.height = new_val; 

      // adjust iframe element 
      var iframe = document.getElementById(ed.id + '_ifr'); 
      iframe.style.height = new_val; 
     }); 
    } 
});