JSFiddle - React, Tailwind, and code Playground

by psyafter

HTML

<!DOCTYPE html>
<html>
<head>
       <title>Ajax &mdash; CKEditor Sample</title>
       <meta content="text/html; charset=utf-8" http-equiv="content-type" />   
      
        <script type="text/javascript" src="http://cdn.skatrix.com/tools/ckeditor/4.0.1/ckeditor.js"></script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js"></script>
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.10.0/jquery-ui.min.js"></script>
        <link rel="stylesheet" type="text/css" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.10.0/themes/smoothness/jquery-ui.css" />

</head>
<body>
        <script type="text/javascript">
var editor, html = '';
var config = {};
	
function createEditor()
{
        if ( editor )
                return;

        $("#editor").bind('dialogopen', function() //JQ
        {
                editor = CKEDITOR.replace('editor1', config, 'aaa');
        }).bind('dialogclose', function()
        {
                removeEditor();//CK
                $(this).dialog('destroy');
        })
        .dialog({autoOpen: false,
                maxHeight:0.95 * $(window).height(),//1
                width: 800,
                modal: true,
                position: 'top',
                resizable: false,
                autoResize: true }).dialog('open');
}

function removeEditor()
{
        if ( !editor )
                return;

        // Destroy the editor.
        editor.destroy();
        editor = null;
}
    </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">
            <textarea id="editor1" ><a href="/"
>click me</a></textarea>
         
        </div>
</body>
</html>

CSS

#editor1{display:none}