froala-editor
Version:
A beautiful Javascript WYSIWYG HTML rich text editor made by devs for devs. High performance and modern design make it easy to use for developers and loved by users.
47 lines (38 loc) • 1.73 kB
HTML
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/material-design-iconic-font/2.0.2/css/material-design-iconic-font.min.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.4.0/css/font-awesome.min.css">
<link rel="stylesheet" href="../../css/froala_editor.css">
<link rel="stylesheet" href="../../css/froala_style.css">
<link rel="stylesheet" href="../../css/plugins/fullscreen.css">
<style>
body {
text-align: center;
}
section {
width: 81%;
margin: auto;
text-align: left;
}
</style>
</head>
<body>
<section id="editor">
<div id='edit' style="margin-top: 30px;">
<h1>Full Screen</h1>
<p>Using the <code>fullscreen.min.js</code> plugin it is possible to use the WYSIWYG HTML editor in fullscreen mode.</p>
<p>Make sure that the <code>fullscreen</code> button is included in the <a href="https://www.froala.com/wysiwyg-editor/docs/options#toolbarButtons" title="toolbarButtons">toolbarButtons</a> list. By default the fullscreen button is already in the list, but if you changed the buttons list just make sure you don't omit the fullscreen button.</p>
</div>
</section>
<script type="text/javascript" src="http://cdnjs.cloudflare.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<script type="text/javascript" src="../../js/froala_editor.min.js"></script>
<script type="text/javascript" src="../../js/plugins/fullscreen.min.js"></script>
<script>
$(function() {
$('#edit').froalaEditor()
});
</script>
</body>
</html>