Изменение высоты ввода TinyMCE от высоты textarea

Question

В моей форме используются входы и текстовые поля, некоторые из которых я добавил как элементы TinyMCE. Проблема в том, что входы преобразуются в тот же размер, что и в текстовых областях. Я хотел бы, чтобы входы были той же высоты, что и поля ввода не-TinyMCE (я использую последнюю версию TinyMCE-3.5b2).

Например, TinyMCE добавляет эту таблицу входов и прокручиваемые:

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

Как я могу изменить этот встроенный стиль, чтобы уменьшить высоту для входа в 30px?

У меня также есть posted this на форумах TinyMCE.

Answer 1

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

Это именно тот элемент, который вам нужно будет изменить. Tinymce имеет параметр init и width и height, но есть некоторые случаи, когда этого параметра недостаточно. Из-за того, что редактор iframe явно получает одну и ту же высоту, вам придется также настроить iframe. Вам необходимо будет позвонить по телефону

var new_val = '30px'; 

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

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

Idealy, это должно быть сделано прямо на инициализации редактора. Так что используйте:

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: решение без 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; 
     }); 
    } 
});