Photo by Matthias Heyde on Unsplash

Text Area Auto Xpander v1.0

By Swapnil Sarwe, Published on 28 Sep, 2009

Text Area Auto Xpander 1.0 has couple of new features which were promised in the last post :

Features Added:

  • The ability to give the Xpander functionality to the selected textareas.
  • on load expansion of the textareas if the text is more than the textarea.

Options

  • animation - true or false will have the text area 'expand with ease' or 'expand directly'.
  • xtraSpace - The extra space or height in pixels by which the textarea should expand.
  • delay - The delay in milliseconds in ease for the expansion of the textarea.
  • callBack - The callback function which executes eveytime the text area expands.
  • ids - List of textarea ids to which Xpander has to be applied.

Example:

Xpander with specific textarea ids

<script type="text/javascript" src="Xpander1.0.js">
</script>
<script type="text/javascript">
  window.onload = function(){
	  Xpander({
ids: ['textarea1','textarea2'],
		  animation: true,
		  xtraSpace: 15,
		  delay: 10,
		  callBack: function(){
			  /* Your callback function here */
		  }
	  });
  }
</script>

Xpander for all textarea (no ids mentioned)

<script type="text/javascript" src="Xpander1.0.js">
</script>
<script type="text/javascript">
    window.onload = function(){
        Xpander({
            animation: true,
            xtraSpace: 15,
            delay: 10,
            callBack: function(){
                /* Your callback function here */
            }
        });
    }
</script>

Xpander 1.0

If you find any bug, or have something which will improve this plug in just let me know in the comment section.

© 2021 Tails - Tailwindcss Page Builder

Instagram Twitter GitHub