jaz303 / jquery-grab-bag
watch download tarball
public
Forks6Right
Watchers36Right
Description: Miscellaneous small jQuery plugins
Homepage: http://onehackoranother.com/projects/jquery/jquery-grab-bag/
Clone URL: git://github.com/jaz303/jquery-grab-bag.git
jquery-grab-bag / autogrow-textarea.html
100644 61 lines (48 sloc) 2.341 kb
raw blame history 
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
 
<html>
  <head>
    <title>jQuery Grab Bag - Auto-Growing Textarea Plugin</title>
    <link rel="alternate" type="application/rss+xml" title="RSS 2.0" href="http://onehackoranother.com/feed/" />
    <link rel="alternate" type="text/xml" title="RSS .92" href="http://onehackoranother.com/feed/rss/" />
    <link rel="alternate" type="application/atom+xml" title="Atom 1.0" href="http://onehackoranother.com/feed/atom/" />
    <script type='text/javascript' src='javascripts/jquery-1.2.6.min.js'></script>
    <script type='text/javascript' src='javascripts/jquery.autogrow-textarea.js'></script>
    <link rel="stylesheet" href="stylesheets/main.css" type="text/css" />
  </head>
  <body>
    <div id='container'>
      
      <h1>
        grab bag <span class='subtitle'>- assorted jQuery plugins</span>
      </h1>
      
      <div id='sidebar'>
        <ul id='project-nav'>
          <li><a href='index.html'>Plugin List</a></li>
        </ul>
        <ul id='ohoa-nav'>
          <li><a href='http://onehackoranother.com/feed/' id='subscribe'>Subscribe for updates &raquo;</a></li>
          <li><a href='http://onehackoranother.com/projects/'>Back to projects &raquo;</a></li>
          <li><a href='http://onehackoranother.com/'>Back to onehackoranother.com &raquo;</a></li>
        </ul>
      </div>
      
      <div id='main'>
        
        <h2>Auto-Growing Textarea</h2>
        
        <p>
          A textarea which grows vertically as it becomes full. This implementation -
          inspired by Facebook - relies on a hidden auxiliary <code>div</code>, preventing
          flickering scrollbars.
        </p>
        
        <div class='caption'>Example:</div>
        <pre>$('textarea').autogrow();</pre>
        
        <textarea rows='6' style='line-height:1; font-size: 120%; width: 100%'></textarea>
 
        <script type='text/javascript'>
          $(function() {
            $('textarea').autogrow();
          });
        </script>
        
        <h3>Direct Link</h3>
        
        <p><a href='http://github.com/jaz303/jquery-grab-bag/tree/master/javascripts/jquery.autogrow-textarea.js'>jquery.autogrow-textarea.js</a></p>
      
      </div>
      
    </div>
  </body>
</html>