How to add resizer to textarea in IE?

Question

How to add resizer to textarea in IE the same as in Chrome and Firefox?

jQuery.resizable() won't work for me.

Semiology

Check out my griphandle plugin I made a while back for inspiration: github.com/PeeHaa/gripHandler – Microchemistry

Maybe this is useful info: Chrome and Firefox's textarea resize functionality is native. This means you will have to search for and try out plugins for Internet Explorer. Good luck. – Monotheism

Answer 1

Internet Explorer (and Microsoft Edge, as of May 5, 2016) do not support native gripper/resizing on textarea elements. While these may eventually be supported in the future (in Microsoft Edge), the best option you have for now is to polyfill the functionality.

Many options exist online that do this, but if you're using jQuery and jQuery UI, you could use the Resizable widget:

$("textarea").resizable({
    handles: "se" // place handle only in 'south-east' of textarea
});

By default, this places the handler beneath the textarea. I didn't like this:

.ui-resizable-handle {
    transform: translateY(-100%);
}

You can see the end-result here: http://jsbin.com/rumokazepo/edit?html,css,js,output

Dewie

As its not as good as builtin resize on capable browsers - how can I exclude script code for Firefox, Chrome etc. who already support CSS resize=both ? (w/o dynamic server-side HTML generation) – Wen

Answer 2

Can't this be solved in CSS by defining the width and height like so:

.resize {
     width: 100px;
     height: 100px;
 }

 <textarea class="resize"></textarea>

Sonority

Not really. The question is about allowing the user to dynamically resize the textarea, not about setting a size to the textarea. – Woodson