JSFiddle - React, Tailwind, and code Playground
HTML
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.10.3/jquery-ui.min.js"></script>
<link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.10.3/themes/smoothness/jquery-ui.css">
<script src="http://ckeditor.com/apps/ckeditor/4.3/ckeditor.js"></script>
<p>Click the buttons to create jquery dialog and CKEditor instance.</p>
<p>
<input onclick="createEditor();" type="button" value="Create Editor" />
</p>
<div id="editor" class="other-popups">
<textarea id="editor1" ><a href="/">click me</a></textarea>
</div>
CSS
#editor1{display:none}
JavaScript
var editor, html = '';
var config = {};
$("input").click(function() {
if ( editor )
return;
$("#editor").bind('dialogopen', function() //JQ
{
editor = CKEDITOR.replace('editor1', config, 'aaa');
}).bind('dialogclose', function()
{
removeEditor();
$(this).dialog('destroy');
})
.dialog({autoOpen: false,
maxHeight:0.95 * $(window).height(),//1
width: 800,
modal: false,
position: 'top',
resizable: false,
autoResize: true }).dialog('open');
});
function removeEditor()
{
if ( !editor )
return;
// Destroy the editor.
editor.destroy();
editor = null;
}