简体   繁体   中英

Tiny MCE - set full-screen when editor is loaded?

I use tiny_mce as word-like editor in textareas that are in iframes. I want to use whole iframe space. TinyMCE has a fullscreen button, but I need to set full-screen mode automatically when plugin has loaded. Is there a function/trigger to call this mode (or the button)? Thanks for help.

In the IFRAME document you can instruct TinyMCE to switch to fullscreen mode once the textarea has initialized. The following code will need to go into your IFRAME:

<script type="text/javascript">
tinyMCE.init({
    mode : "exact",
    elements : "description",  // This is the id of the textarea
    plugins : "fullscreen",
    theme : "advanced",
    theme_advanced_buttons1 : "fullscreen,code",
    theme_advanced_buttons2 : "",
    theme_advanced_toolbar_location : "top",
    theme_advanced_toolbar_align : "left",
    theme_advanced_statusbar_location : "bottom",
    oninit : function() {  // Once initialized, tell the editor to go fullscreen
        tinyMCE.get('description').execCommand('mceFullScreen');
    }
});
</script>

....

<textarea id="description"></textarea>

The TinyMCE fullscreen plugin will fill up the current window - and, since the IFRAME is it's own window, the this should fill the IFRAME.

Edit: This technique can also be used with the TinyMCE JQuery library. The options are the same but the invocation syntax is a little different. Again, the key lines are the oninit callback:

$(document).ready(function() {
    $('#description').tinymce({   // "description" is the id of the TEXTAREA
        // ... same options inserted here ...
        oninit : function() {
            tinyMCE.get('description').execCommand('mceFullScreen');
        }
    });
});

You just need to insert the following code into the tinyMCE.init({}) function:

setup : function(ed) {
  ed.on('load',function(e){
      ed.execCommand('mceFullScreen');
  });

},

Ps: remember the comma if you have other instruction after it or it will fail. ;-)

setTimeout(\'(function(){tinyMCE.get("YourElementID").execCommand("mceFullScreen");})()\',2500);

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM