2012-07-08 155 views
3

我已成功將一個tinyMCE編輯器添加到我的網絡應用程序,以便用戶可以做筆記。我有它在一個div內取代textarea,以便div可以調整頁面大小,並且textarea始終可以設置爲寬度:100%和高度:100%tinyMCE的iframe或表格高度調整不正確

我的tinyMCE.init如下所示:

tinyMCE.init({ 
    mode: "specific_textareas", 
    editor_selector: "notes-editor", 
    theme: "advanced", 
    plugins: "", 
    theme_advanced_buttons1: "bold,italic,underline,strikethrough,|,bullist,numlist,|,undo,redo,|,forecolor,backcolor", 
    theme_advanced_toolbar_location: "top", 
    theme_advanced_toolbar_align: "left", 
    theme_advanced_statusbar_location: "none", 
    theme_advanced_resizing: false, 
    height: "100%", 
    width: "100%" 
}); 

不幸的是,它返回如下所示的編輯: enter image description here

無論我如何改變高度,從CSS或JS吧,是的,我可以編輯「條」永遠不會改變。奇怪的是,這隻適用於高度。

我已經從試圖改變表所做的一切(即note_contents_tbl)的IFRAME(即note_contents_ifr),但一無所獲。

任何幫助將不勝感激。

回答

2

通過將高度和寬度設置爲100%不起作用。 TinyMCE在iframe中創建編輯器,而iframe又嵌套在表格中。將高度設置爲100%不會繼承div的大小。

我認爲這可能是你的問題,如果真的是這樣的問題,那麼你應該從%改變widthheight值數值完全相同任何你想要的width和您的包裝股利height或和這樣做去除從init%只使用,即

height: "300", 
width: "500" 

要更改尺寸編程,您可以使用

var ed = tinymce.activeEditor; 
var width = '500'; 
var height = '300'; 
ed.theme.resizeTo(width, height); 

tinyMCE ConfigurationSO上的另一個答案。

+0

謝謝謝赫。這正是我需要的代碼('ed.theme.resize')。我已經看到寬度設置爲非%工作,但我無法調整它的大小。你會知道如何選擇一個特定的編輯器,即使我在頁面上有2個,我只想調整一個?例如。是否有'var ed = tinymce.activeEditor(selector)'? – 2012-07-09 10:01:44

+1

歡迎和是的有' var ed = tinyMCE.get('myarea1')':-) – 2012-07-09 10:21:58

+0

再次感謝:) – 2012-07-09 11:38:07

0

下面的CSS使TinyMCE的處理height: 100%的剩餘空間:

td.mceIframeContainer, td.mceIframeContainer iframe { position: fixed; }