Demand : Custom height variation with the input content input box; 36px height when not a single-line, the content of less than 4 rows transformed input block is increased or decreased with the height of the input content is larger than the constant height of 4 lines, the content scroll;
Difficulty : while reducing the height and text content when no content row height is reduced;
Interactive :
Solution : hostInput as input frame height with the input content changes, a new shadowbox, the height is 0, a width equal to the width hostInput, and beyond hide, put a block shadowInput in shadowbox, the text text input box block and styles are consistent, then taken as the height of the height shadowInput hostInput calculated.
HTML:
CSS:
JS: