Search code examples
javascriptjquerytextareajquery-eventsslidedown

How to animate the transition in jQuery

I am using jQuery to expand increase the rows of the textarea from 1 to 4 on focus. Lets just say it is not very pleasing to the eye.

I want it to slowly ease from 1 rows to 4 rows.

I currently use:

  $(document).ready(function(){
     $('.comment').focus(function(){
         $(this).attr('rows', '4');
     });
  });

How can I animate it to make it slide down slower?

I appreciate any help.

Solution

  • http://api.jquery.com/animate/

    Gives some info on custom property animations. also making animation on css height attribute might make it look more pleasant to the eye.