2012-09-10 14 views
14

私はxml、javaプログラムを持つウェブサイトを開発しています。そこで、TextAreaでプログラムを表示するためにCodeMirrorを選択しました。私は正常に表示されました。デフォルトのheight300pxで、codemirror.cssです。コードミラーでプログラムでTextAreaの高さと幅を変更するには?コーデックミラーのTextAreaの高さと幅を変更

答えて

45

The CodeMirror user manual is your friend.

例コード:

<textarea id="myText" rows="4" cols="10"></textarea> 

<script type="text/javascript" language="javascript"> 
    var myTextArea = document.getElementById('myText'); 
    var myCodeMirror = CodeMirror.fromTextArea(myTextArea); 
    myCodeMirror.setSize(500, 300); 
</script> 
+0

それは動いています。おかげです。 –

2

クリスチャンからの答えは素晴らしいですが、アップだけでヘッド:

自動サイズ変更デモ。

CodeMirror { 
    border: 1px solid #eee; 
    height: auto; 
} 

autoにエディタの高さのスタイルを設定し、viewportMarginに無限の価値を与えることによって、CodeMirrorは自動的にその内容に合わせてサイズを変更させることができます。

出典:https://codemirror.net/demo/resize.html

+0

何らかの理由で、これは 'auto'以外の値では機能しません – Toast

4
myCodeMirror.setSize(null, 500); 

あなたは、その次元を変更してはならないことを示すために、それらのいずれかのためにnullを渡すことができます。

Documentation:

cm.setSize(width: number|string, height: number|string) 

プログラム(該当 CSSルールをオーバーライド)エディタのサイズを設定します。幅と高さは数字( ピクセルと解釈されます)またはCSS単位(たとえば100%)のいずれかです。 のいずれかにNULLを渡すと、そのディメンションを変更しないことを示すことができます。

関連する問題