一个iframe中的CKEditor内联编辑器 [英] CKEditor inline editor on elements within an iframe
问题描述
在应用程序中，我在iframe中包含可编辑元素，并希望将CKEditor内联应用于这些元素。除了当我滚动iframe时，CKEditor工具栏不会随其滚动。是否有一个特殊的标志或某种方式让工具栏滚动iframe内容而不是父窗口？另外我想避免将CKEditor脚本添加到iframe中。
In an application I have content editable elements within an iframe and want to apply inline CKEditor to those elements. It works except when I scroll the iframe the CKEditor toolbars do not scroll with it. Is there a special flag or some way to get the toolbars to scroll with the iframe contents rather than with the parent window? Also I want to avoid adding the CKEditor script into the iframe.
推荐答案
您可以通过将iframe与容器元素这与iframe的大小相同，并具有相对定位。
You can achieve this by wrapping the iframe with a container element that is the same size as the iframe and has relative positioning.
<div id="iframe-wrapper">
<iframe>
<body>
<div contenteditable></div>
</body>
</iframe>
</div>
然后您将每个ckeditor面板的位置移动到该容器元素中，绝对定位值将起作用。
Then you move the position of each ckeditor panel into that container element and the absolute positioning values will work.
var el = $('iframe').contents().find('[contenteditable]');
el.ckeditor();
el.ckeditorGet().on('instanceReady', function(){
$('body > .cke_float').appendTo('#iframe-wrapper');
});
这篇关于一个iframe中的CKEditor内联编辑器的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
