Javascript 代码镜像编辑器全屏-如何向代码镜像添加自定义函数

有一个漂亮的房间。但是，如果CODEMRIVER控件在其他<代码>位置中间：绝对值<代码>或代码>相对 div（CODEMRIVER控件的绝对定位将不再与整个页面相对），那么这将不起作用。 我们可以向CodeMirror添加一个新命令以全屏显示：

CodeMirror.commands.fullscreen = function (cm)
{
var fs_p = $(cm.getWrapperElement());

if ( cm._ic3Fullscreen == null) {
    cm._ic3Fullscreen = false;
    cm._ic3container = fs_p.parent();
}

if (!cm._ic3Fullscreen)
{
    fs_p = fs_p.detach();
    fs_p.addClass("CodeMirrorFullscreen");
    fs_p.appendTo("body");
    cm.focus();
    cm._ic3Fullscreen = true;
}
else
{
    fs_p = fs_p.detach();
    fs_p.removeClass("CodeMirrorFullscreen");
    fs_p.appendTo(cm._ic3container);
    cm.focus();
    cm._ic3Fullscreen = false;
}
};

之后，我们需要在创建CodeMirror时绑定这个新命令。将此添加到选项中：

extraKeys: {"F11": "fullscreen"}

---

问题是在

CodeMirrorFullscreen

CSS类中放置什么以确保全屏工作？

使用

position:fixed

而不是

absolute

应该可以做到这一点

要测试它，只需修改CodeMirror的fullscreen.html演示的CSS，如下所示：

  form {
    position: relative;
  }
  .CodeMirror-fullscreen {
    display: block;
    position: fixed;
    top: 0; left: 0;
    width: 100%;
    z-index: 9999;
  }

---

（添加的

表单

选择器不是解决方案的一部分。它只是为了确保我们正在测试您关心的案例–在

中使用
位置：绝对
。CodeMirror全屏

不起作用）。

“关于如何制作全屏版本”-什么的全屏版本？你的问题没有意义。请澄清一点，如果你知道codemirror，你理解这个问题，因为它也是他们演示的一部分。请详细说明。你所说的“绝对位置可能不再出现在屏幕上”是什么意思？