SO Help: jQuery cursor over Textarea Corner
by Craig Martin
HTML
<textarea id="p" rows="5"></textarea>
CSS
textarea { margin: 1em; outline: none; text-align: justify; }
JavaScript
jQuery('#p').val("ground: -ms-linear-gradient(top, #dbdbdb 0%,#f4f4f4 25%,#ffffff 50%,#f4f4f4 75%,#dbdbdb 100%);");
function autotextheight(targ){
while(jQuery(targ).outerHeight() < this.scrollHeight + parseFloat(jQuery(targ).css("borderTopWidth")) + parseFloat(jQuery(targ).css("borderBottomWidth"))) {
jQuery(targ).height(jQuery(targ).height()+1);
};
}
autotextheight('#p');
$(function() {
// changes mouse cursor when highlighting loawer right of box
$(document).on('mousemove', 'textarea', function(e) {
var a = $(this).offset().top + $(this).outerHeight() - 16, // top border of bottom-right-corner-box area
b = $(this).offset().left + $(this).outerWidth() - 16; // left border of bottom-right-corner-box area
$(this).css({
cursor: e.pageY > a && e.pageX > b ? 'nw-resize' : ''
});
})
// the following simple make the textbox "Auto-Expand" as it is typed in
.on('keyup', 'textarea', function(e) {
// the following will help the text expand as typing takes place
while($(this).outerHeight() < this.scrollHeight + parseFloat($(this).css("borderTopWidth")) + parseFloat($(this).css("borderBottomWidth"))) {
$(this).height($(this).height()+1);
};
});
});