使用fixed_toolbar_container和绝对位置时,TinyMce子菜单不会粘在工具栏上

Question

我们想要更好地控制我们在哪里以及如何定位tinymce工具栏.我们发现这个选项fixed_toolbar_container为我们解决了很多问题,但却给我们带来了一个烦人的问题.文件说,fixed_toolbar_container(http://www.tinymce.com/wiki.php/Configuration:fixed_toolbar_container)可用于拥有固定的工具栏.但我们实际上想要使用它是绝对的,所以我们可以将它相对于它的容器定位.

我创建了一个JS小提琴来演示这个问题:http://jsfiddle.net/ronfmLym/2/.通过单击文本打开工具栏时,工具栏将定位为绝对.当您打开子菜单(即通过单击"文件")时,将打开子菜单.现在,当您开始滚动时,子菜单将不会粘在工具栏上.这是因为这些子菜单得到了mce固定类,因为我们设置了fixed_toolbar_container属性.

<div class="element">
    <div class="toolbar-container"></div>
    <div class="content">
        <p>Text</p>
    </div>
</div>

当定位绝对和滚动时,有没有办法让子菜单粘在工具栏上？请记住,当工具栏离开屏幕时,我们将切换到固定定位.

我们认为我们可以通过使用下面的代码修改de子菜单的容器元素来修复它,并覆盖子菜单的顶部位置并使用css将定位器设置为绝对.但这似乎弄乱了工具提示,并且没有重新计算子菜单的"左"css属性,所以位置仍处于关闭状态.

tinymce.ui.Control.prototype.getContainerElm = function() {
    return document.getElementById('toolbar-container');
};

我在stackoverflow上找到的唯一相应问题是这一个:TinyMCE使用fixed_toolbar_container下推子菜单,没有答案.

Answer 1

尝试将工具栏包装在 div 中并尝试position:relative;将其组合在一起，但这次没有合作。

看起来工具栏实际上正在考虑单击时的位置。因此，唯一的冲突是打开的工具栏是否为position:absolute，然后更改为position:fixed，反之亦然。

最好的[手动]方法是在更改工具栏位置的同时调用一个函数：

1. 检测是否有任何菜单打开。
2. 更改工具栏位置。
3. 重新打开已打开的菜单。

懒惰（不鼓励）的修复方法是每当位置发生变化时关闭所有子菜单。这将修复布局，但需要用户再次单击才能恢复菜单。

抱歉，这不是灵丹妙药的答案:(