Event for FullScreen / Side-by-side

[Grestorn]

When opening Fullscreen or side-by-side, my site's menu bar is obstructing the top part of the editor.

I want to resolve that problem by hiding the menu bar as soon as the editor switches to full screen and turn it back on as soon as the full screen mode is left.

I looked through the list of events but I can't find anything for that. Is there a way to achive this?

Thanks & best regards

[CWharton]

Yes to can watch for the fullscreen event

editor.codemirror.on('optionChange', (item) => {
  let fullscreen = item.getOption('fullScreen');
  // Do as you wish below
  console.log(fullscreen);
});

Another option is to override the css with your own so you don't have to remove the toolbar.

[Grestorn]

Thanks for the tips. I'll look into them!

[WangNingkai]

You can try this! :-)

editor.codemirror.on('optionChange', (item) => {
    let fullscreen = item.getOption('fullScreen');
        if (fullscreen)
            $(".editor-toolbar,.fullscreen,.CodeMirror-fullscreen").css('z-index','9999');
});