javascript - TinyMCE 全屏不允许出现模态窗口

Question

我的页面中嵌入了一个 TinyMCE 编辑器。编辑器的全屏选项占据了整个屏幕，工作正常。我还有一个按钮，它使用 Twitter bootstrap 弹出一个模态窗口，它在普通 View 中工作正常。但是当 tinymce 编辑器处于全屏模式时，模态窗口正在初始化但不可见。

当我离开全屏窗口时，模态窗口出现。所以它得到显示，但它在后台。如何让它在全屏模式下显示？

tinymce.init({
                            mode: "exact",
                            elements: "tinymce",
                            theme: "advanced",
                            plugins: 'ice,icesearchreplace,fullscreen',
                            theme_advanced_buttons1: "ec_error,fullscreen,strikethrough,|,bold,italic,underline,|,undo,redo,|,search,replace,|,ice_togglechanges,ice_toggleshowchanges,iceacceptall,icerejectall,iceaccept,icereject",
                            theme_advanced_buttons2: "",
                            theme_advanced_buttons3: "",
                            theme_advanced_buttons4: "",
                            theme_advanced_toolbar_location: "top",
                            theme_advanced_toolbar_align: "left",
                            fullscreen_new_window : false,
                            extended_valid_elements: "p,span[*],delete[*],insert[*]",
                            ice: {
                                user: { name: 'Email Coach', id: 11},
                                preserveOnPaste: 'p,a[href],i,em,b,span'
                            },
                            height: '500',
                            width:'100%'
                        });

Answer 1

TinyMCE 的#mce_fullscreen_container 是z-index: 20000;
Bootstrap 的 .modal 是 z-index: 1050; 而 .modal-backdrop (背景淡化)是 z-index: 1040;

因此，将模态窗口的 z-index 提高到 20000 以上

.modal {
    z-index: 30050;
}
.modal-backdrop {
    z-index: 30040;
}