ckeditor消耗所有可用的高度？

Question

我可以ckeditor动态消费100% height吗？

http://jsfiddle.net/bobbyrne01/jejmqjxa/1/

HTML

<div id="outer">
    <textarea class="ckeditor" id="editor1" name="editor1"></textarea>
</div>
<button>test</buton>

CSS

#outer {
    width: 95%;
    height:500px;
}

Answer 1

在检查ckeditor文档时，尚不支持在%中设置高度 http://docs.ckeditor.com/#!/api/CKEDITOR.config-cfg-height为了得到理想的结果，我建议用CSS将高度设置为100%，而不是用ckedtior.config用javascript读取屏幕高度，在加载时设置大小，调整窗口大小并放置它作为外部元素高度的值。

可能听起来像很多工作，但并不是那么棘手。 Updated fiddle here

要添加的CSS（以获取加载页面上可能包含的所有ckeditors）

div[id^=cke_editor] {
    height:100%;
}

Javascript设置页面加载时外部div的高度

document
    .getElementById("outer")
    .style.height = window.innerHeight+"px";

如果你希望在window resize上使用它，我建议使用jQuery但是你可以不用它。以下是（使用和不使用jQuery）：Cross-browser window resize event - JavaScript / jQuery