Loading Spinner while CKEditor loads
Question
I am using CKEditor on a textarea. Whenever the page loads, there is a small delay where the textarea is rendered as a CKEditor properly.
I would like to have a loading spinner animation display while the editor was loading with no textarea displayed, as opposed to the messed up textarea.
I followed the approach as mentioned here - https://ckeditor.com/forums/FCKeditor-2.x/Loading-Animation , but the image keeps spinning even after the editor is rendered properly. Also, I would like the textarea/editor not to be displayed at all until it is finally rendered.
You can view the Fiddle here: https://jsfiddle.net/mevzqwsa/10/
<html>
<body>
<div id="board" style="position:absolute; left:10px">
<img src="http://i.stack.imgur.com/MnyxU.gif">
</div>
<textarea id="editor1" name="editor1" rows="10" cols="80"></textarea>
<script src="//cdn.ckeditor.com/4.7.1/standard/ckeditor.js"></script>
<script>
function FCKeditor_OnComplete(editorInstance) {
document.getElementById('board').style.visibility = 'hidden';
}
CKEDITOR.replace('editor1');
</script>
</body>
</html>
Thanks a ton in advance!
1 answers
solution1
3 ACCPTED 2017-08-17 17:37:19
You can use CKEDITOR.editor.instanceReady event to accomplish this:
CKEDITOR.replace('editor1', {
on: {
instanceReady: function(evt) {
document.getElementById('board').style.visibility = 'hidden';
}
}
});
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.