Встроенный редактор Ckeditor остается на экране при прокрутке «прокручиваемого» div

Question

У меня есть «прокручиваемый» 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> 

встроенный редактор CKEditor для «редактируемого» DIV должен появиться на странице загрузки. Это делается путем фокусировки div.

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

Проблема в том, что когда я прокручиваю «прокручиваемый» div, встроенный редактор остается на экране. Я хочу, чтобы он оставался «вне экрана», когда я прокручиваю. Я имею в виду, я хочу, чтобы он вел себя как обычный элемент внутри прокручиваемого div.

Я подготовил jsfiddle, но для тестирования я рекомендую просмотреть страницу результатов separately. Испытано в FF и Chrome

Answer 1

Вы можете сделать что-то вроде

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

Посмотреть работу here