Monday, May 12, 2014

Autosize textarea height using jQuery

Auto size textarea height using jQuery.A jQuery auto size plugin automatically adjusts textarea height.

Lets take a look.




JQuery Library and functions

    <script src='http://ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js'></script>
    <script src='jquery.autosize.js'></script>
    <script>
            $(function(){
                $('.autosize').autosize();
            });
        </script>

Textarea Code

<textarea class='autosize'>Start typing in this text area box.</textarea>

Css Codes

<style>

            textarea {
                border:2px solid #ccc;
                padding: 10px;
                vertical-align: top;
                width: 25%;
            }

            .autosize {
                -webkit-transition: height 0.2s;
                -moz-transition: height 0.2s;
                transition: height 0.2s;
            }

        </style>
Please share your comments and feedback.Thanks.

No comments:

Post a Comment