JSFiddle - React, Tailwind, and code Playground
HTML
<script src="http://rawgithub.com/Codecademy/textarea-helper/master/textarea-helper.js"></script>
<textarea></textarea>
<div class="tail"></div>
CSS
.tail {
background: red;
width: 50px;
min-height: 50px;
position: absolute;
}
textarea {
width: 250pxpx;
min-height: 100px;
}
JavaScript
$('textarea').on('keyup paste cut mouseup', function () {
// Get the textarea's content height.
var contentHeight = $(this).textareaHelper('height')
// Set the textarea to the content height. i.e. expand as we type.
$(this).height(contentHeight);
// Follow the caret arounbd.
$('.tail').css(
$(this).textareaHelper('caretPos')
);
});
// Call it manually at first.
$('textarea').keyup();