滚动“可滚动” div 时，CKeditor 内联编辑器留在屏幕上答案

【问题标题】：Ckeditor inline editor stays on screen when scrolling a "scrollable" div滚动“可滚动” div 时，CKeditor 内联编辑器留在屏幕上
【发布时间】：2015-05-18 13:13:36
【问题描述】：

我有一个 “可滚动” div。在这个 div 中，我有一些文本和另一个 div，其中 contenteditable=true。

HTML 源代码如下所示

<div id='scrollable' style="overflow:scroll;height:500px;width:90%;position:absolute">
some text
   <div id='editable' style="color:red" contenteditable=true>editable div</div>
some text
</div>

“可编辑”div 的内联 ckeditor 编辑器应出现在页面加载时。这是通过聚焦 div 来完成的。

 $( document ).ready(function() {
  $("#editable").focus();
});

问题是当我滚动“可滚动” div 时，内联编辑器会停留在屏幕上。我希望它在滚动时保持“屏幕外”。我的意思是，我希望它表现得像可滚动 div 中的常规元素。

我准备了jsfiddle，但为了测试，我建议查看结果页面separately。在 FF 和 Chrome 中测试

【问题讨论】：

标签： javascript jquery scroll ckeditor

【解决方案1】：

你可以这样做

$( document ).ready(function() {
  // Handler for .ready() called.
  $("#editable").focus();
     setInterval(function(){$("#cke_editable").css("top",($("#editable").offset().top - $("#cke_editable").height())+"px")})
});

看到它工作here

【讨论】：

感谢您的回答，但它仅适用于 Chrome，不适用于 FF。
我为 setInterval (10) 添加了一个时间参数，现在它可以在 FF 中使用。我将进行一些测试，如果它对我有用，我会将您的答案设置为已接受。
太好了...我只是给您举了一个例子...如果您与多个编辑器一起工作，您将不得不做更多的补充。