kendo编辑器,最大化和最小化控制?

时间:2014-05-27 12:28:20

标签: javascript jquery kendo-ui kendo-editor

如何使用kendo编辑器同时最大化和最小化控制。我尝试了kendo网站中的每个控件。但我无法解决这个问题。

 <textarea id="Editordiv" class="inputfield" rows="10" cols="30" style="width:100%;height:500px" data-bind="kendoEditor:{ value:htmlData,tools: [ 'bold','italic','underline','strikethrough','justifyLeft','justifyCenter','justifyRight','justifyFull','insertUnorderedList','insertOrderedList','indent','outdent','createLink','unlink','insertImage','subscript','superscript','createTable','addRowAbove','addRowBelow','addColumnLeft','addColumnRight','deleteRow','deleteColumn','viewHtml','formatting','fontName','fontSize','foreColor','backColor']}"></textarea>

我需要为编辑器最大化和最小化添加两个按钮。 任何人都知道让我...... enter image description here

我尝试单击最大化按钮..我想将编辑器显示为全屏。每个项目包含单独的div。 提前谢谢..

1 个答案:

答案 0 :(得分:2)

您应该定义自定义工具。类似的东西:

$("#Editordiv").kendoEditor({
    tools: [
        {
            name: "maximize",
            tooltip: "Maximize",
            exec: function(e) {
                var editor = $(this).data("kendoEditor");
                editor.wrapper.css("height", "500px");
            }
        },
        {
            name: "restore",
            tooltip: "Restore",
            exec: function(e) {
                var editor = $(this).data("kendoEditor");
                editor.wrapper.css("height", "200px");
            }
        },
        'bold',
        'italic',
        'underline',
        'strikethrough'

exec设置heightwidth

请参阅此处的示例:http://jsfiddle.net/OnaBai/HFdEs/