jQuery Simple Example
HTML
<script src="//www.addressfinder.co.nz/assets/v2/widget.js"></script>
<div class="autogrow" contenteditable="true"></div>
CSS
.autogrow {
border: 1px solid rgb( 0, 0, 0 );
padding: 10px;
}
@keyframes line_insert {
from {
height: 0px;
}
to {
height: 20px;
}
}
.autogrow[contenteditable] > div {
animation-duration: 250ms;
animation-name: line_insert;
//height:20px;
}
.autogrow[contenteditable] {
overflow: hidden;
line-height: 20px;
}
JavaScript
$(".autogrow").keydown(function(e){
if (e.keyCode == 13 && e.shiftKey || e.keyCode == 13)
{
$(this).animate({height: $(this).height()+20},200);
$(this).append('<div><br></div>');
}
});