javascript - 全屏模式下的CLEditor文本编辑器

我使用的是CLEditor文本编辑器，突然我发现没有全屏模式（类似于wordpress的著名“分散模式”）。我正在尝试使用基本Javascript自行构建全屏模式（无论我叫我疯了）。到目前为止，我已经将文本编辑器放置在应有的位置。当我单击全屏模式时，它将抓住CLEditor容器div并将其放在另一个div上，该div具有一些样式来填充所有浏览器窗口，而将其余样式留在后面。它可以工作，（中间有一些错误），但是我不能在编辑器中输入-至少在调整浏览器窗口大小之前。似乎编辑器需要摇晃“ Hello”才能重新开始工作。我不知道它似乎需要通过Javascript或jQuery进行“更新”。

有人可以帮忙吗？

最好的祝福，
蒂亚戈·卡斯特罗（Tiago Castro）

最佳答案

为此，我编写了插件jquery.cleditor.fullscreen.js（与jquery.cleditor.js放在同一位置）

(function($) {
    //Style for fullscreen mode
    var fullscreen = 'height: 100%; left: 0; position: fixed; top: 0; width: 100%; z-index: 9999;',
        style = '';

    // Define the fullscreen button
    $.cleditor.buttons.fullscreen = {
        name: 'fullscreen',
        image: 'fullscreen.gif',
        title: 'Fullscreen',
        command: '',
        popupName: '',
        popupClass: '',
        popupContent: '',
        getPressed: fullscreenGetPressed,
        buttonClick: fullscreenButtonClick,
    };

    // Add the button to the default controls before the bold button
    $.cleditor.defaultOptions.controls = $.cleditor.defaultOptions.controls.replace("bold", "fullscreen | bold");

    function fullscreenGetPressed(data) {
        return data.editor.$main.hasClass('fullscreen');
    };

    function fullscreenButtonClick(e, data) {
        var main = data.editor.$main;

        if (main.hasClass('fullscreen')) main.attr('style', style).removeClass('fullscreen');
        else {
            style = main.attr('style');
            main.attr('style', fullscreen).addClass('fullscreen');
        };

        editor.focus();
        return false;
    }
})(jQuery);

在cleditor images文件夹中，我放入了fullscreen.gif。
比在jquery.cleditor.js之后的html头部添加此插件。