TinyMCE 5中的透明编辑器背景

Question

我想将TinyMCE编辑器的背景颜色更改为透明。我设法在TinyMCE 4中做到了这一点，但是在TinyMCE 5中似乎无法使用相同的方法。

我在TinyMCE4中使用的方法是：

  tinymce.init(
   {
    plugins: 'link',
    'force_br_newlines' : true,
    'force_p_newlines' : false,
    'forced_root_block' : 'div',
    width:'99%',
    height: '100%',
    resize: false,
    menubar: false,
    skin: 'kairos',
    statusbar: false,
    plugins : "inlinepopups,insertdatetime,fullscreen",
    body_id:'mission',
    toolbar: 'undo redo | bold italic underline strikethrough | link',
    branding:false,
    init_instance_callback : editorInitialized,
    selector: '#missstat'
   });

和

function editorInitialized()
 {
  b = tinyMCE.editors['missstat'].getWin().document.body;
  $(b).css({'color':'#000000','background-color':'rgba(0,0,0,0)','color':'#FFFFFF'});
  $('.mce-edit-area, .mce-tinymce').css({'background-color':'rgba(0,0,0,0)'});
 }

我发现，可以使用rgba（0,0,0，.1）更改编辑器的颜色，这将导致几乎黑色的透明背景。相反，背景会变成蓝色，并且不是很透明。如果我使用rgba（0,0,0,0），背景只会保持白色（#FFFFFF），这在我正在使用的主题中是默认设置（注意：我将氧化黑主题复制到了“ kairos”，只是为了可以在主题中进行编辑，但直到现在我还没有编辑任何内容。

也许在TinyMCE 5中（与TinyMCE 4相比，“ mce-edit-area”和“ mce-tinymce”类的名称已更改。

所以我的问题是：如何将背景颜色更改为透明？

注2：我也尝试使用“ transparent”代替rgba（0,0,0,0），这也不起作用。

Answer 1

我找到了解决方案：

代替

$('.mce-edit-area, .mce-tinymce').css({'background-color':'rgba(0,0,0,0)'});

使用

$('.tox-edit-area__iframe').css({'background-color':'rgba(0,0,0,0)'});

而且，您的背景是透明的！

PS，如果您不使用iframe，则可以使用.tox-edit-area代替.tox-edit-area__iframe，但我尚未对此进行测试。