刚开始在一个MVC剃刀项目中使用TinyMCE,对HTML编辑印象深刻。
当我去使用它全屏然而(使用以下选项)
$('#ApplicationHtmlTemplate').tinymce({
theme: "modern",
plugins: "code,pagebreak,fullpage,table,fullscreen,paste,spellchecker",
toolbar1: "undo | redo | copy | paste | searchreplace | spellchecker | table | pagebreak | fullpage | fullscreen"
})
我注意到它出现在bootstrap标题栏下面:
什么是“正确”的方法使TinyMCE编辑出现在引导程序导航栏的下面或上面?最好是在页眉和页脚之间,但全屏也可以。
我试着设置mce-fullscreen
类的顶部和/或边距,使用下面的样式,但这a)似乎很笨拙,b)不起作用,因为高度是全屏,所以滚动条从底部消失。
div.mce-fullscreen {
top: 55px;
}
5条答案
按热度按时间nhaq1z211#
对于“全屏”TinyMCE,* 在引导程序导航栏的顶部 *,您只需要将
.mce-fullscreen
类的z-index
设置为大于导航栏的z-index
。如果你使用的是
Less
,在引导程序variables.less
文件中有一个名为@zindex-modal
的变量,用于定义引导程序模态弹出窗口的Z索引。或者,如果您只使用Bootstrap“raw”,则:
**注意:**这不会将其放在页眉和页脚之间,因此仍在寻找更好的答案。
x33g5p2x2#
将top作为
nav-bar
页眉或页脚的高度添加到样式中:htzpubme3#
对于tiny 5,当你从某个自定义工具栏操作切换到引导模式时,它们会出现在编辑器下,并且不可见。如果你退出全屏模式,那么该模式就会可见(前提是它之前没有被隐藏)。所以我修改了选择器
.tox.tox-tinymce.tox-fullscreen
的z索引值,如下所示。这将使模态显示在编辑器的顶部,即使它处于全屏模式。
cwdobuhd4#
这很简单,只需添加全屏插件,并不意味着要下载额外插件,只需在包含TinyMCE编辑器地方添加一些代码,只需添加以下代码
如果已包含插件,则使用逗号“"添加。例如,plugins:[“等”、“全屏”]、
44u64gxh5#
您的插件语法不正确:
您必须使用空格(而不是逗号)分隔插件:
查看此处:https://www.tinymce.com/docs/configure/integration-and-setup/#plugins