Fork me on GitHub

Expandable-input

A lightweight jQuery plugin to make a textbox expanded when it is focused on.

Download .zip Download .tar.gz View on GitHub

How to include

Simply include jquery and jquery.expandable you have downloaded.

<script src="http://code.jquery.com/jquery-[latest].min.js">
<script src="jquery.expandable.js">

How to use

Create a textbox in HTML.

<input id="search" type="text" ></input>

Then activate it in JS.

$("#search").expandable();

Options

$("#search").expandable({
  width: 500, // width, extended to (default is 150)
  duration: 1000, // duration of the animation (default is 300)
  action: function(text){ // function triggered when you press enter. Receive input's value as a parameter.
    alert("Hello "+text);
  }
});