Question

I need to create a facebook look a like status update textbox.
I mean, first it will be like a tiny slim textbox and when user clikcs on it,
it will become big, kind of textarea.

does anybody has any idea about how to do it??

N.B. Please see the attached image.

Answer 1

You don’t necessarily need jQuery or JavaScript for this today. You can actually do this with pure CSS by using the :focus pseudo-class in your selector:

textarea {
  width: 500px;
  height: 20px;
}

textarea:focus {
  height: 100px;
  /* Uncomment for gradual resizing
  -webkit-transition: all 1s;
  -moz-transition:    all 1s;
  -ms-transition:     all 1s;
  -o-transition:      all 1s;
  transition:         all 1s;
  */
}

Dabblet: http://dabblet.com/gist/3429275?result