Advanced Search

Dynamically expand a textarea based on the amount of text

/ Published in: JavaScript
Save to your folder(s)

Expand | Embed | Plain Text

Copy this code and paste it in your HTML 
  1. <!DOCTYPE HTML>
  2. <html>
  3. 	<body>
  4. 		<textarea id="txtarea" style="width: 100px;,font-size: 16px;line-height: 1; height: 16px;"></textarea>
  5. 		<script type="text/javascript">
  6.  
  7. 		document.getElementById('txtarea').addEventListener('keyup', function () {
  8. 			this.style.height = 0; // this is necessary to make it shrink when deleting
  9. 			this.style.height = this.scrollHeight + 'px';
  10. 		}, false);
  11.  
  12. 		</script>
  13. 	</body>
  14. </html>

Report this snippet


Comments

RSS Icon Subscribe to comments

You need to login to post a comment.