froala-editor
Version:
The next generation 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.
58 lines (48 loc) • 1.84 kB
HTML
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<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">
<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>Auto-Adjustable Height</h1>
<p>The editor's height will automatically adjust between the <code>heightMin</code> and <code>heightMax</code>
values to fit the content inside the editable area.</p>
<ul>
<li><a href="https://www.froala.com/wysiwyg-editor/docs/options#heightMin" target="_blank"
title="heightMin option">heightMin</a> will prevent the rich text editor's box being smaller than the
value passed.</li>
<li><a href="https://www.froala.com/wysiwyg-editor/docs/options#heightMax" target="_blank"
title="heightMax option">heightMax</a> will prevent the rich text editor's box being taller than the
value passed. If the text is too long, then the WYSIWYG HTML editor will get a vertical scrollbar.</li>
</ul>
</div>
</section>
<script type="text/javascript" src="../../js/froala_editor.min.js"></script>
<script type="text/javascript" src="../../js/plugins/lists.min.js"></script>
<script type="text/javascript" src="../../js/plugins/link.min.js"></script>
<script>
(function () {
new FroalaEditor("#edit", {
heightMax: 400,
heightMin: 200
})
})()
</script>
</body>
</html>