Stretchy: Form Element Autosizing

Stretchy makes form element autosizing the way it should be, meaning that every text element box in your design expands to fit text inputs beautifully. (Everybody likes when things just happen automatically, right?)

This plugin can handle multiple form controls from text areas to inputs to selection menus. It has a tiny footprint at only 1.5 kb minified and is a standalone tool with no jQuery or other dependencies. It works with existing HTML and CSS — a real bonus if you want to add it to a site you already have. Stretchy also automatically accounts for newly added controls, requires to javascript knowledge to use and works in all modern web browsers, including Internet Explorer 9+.

Stretchy has a spartan API, since in most cases you don’t need to call it at all. Stretchy works via event delegation and detects new elements via mutation observers, so you do not need to call any API methods for adding new elements via scripting (e.g. AJAX), but if you do need API methods, they are available in the documentation.

To use, just include the script anywhere in the website and you are ready to go!