ansaurus

Question

Answer 1

+3 A:

If you can set pixel or column sizes (instead of using the rows and cols attributes), you can use the :focus CSS pseudo-class:

HTML:

<textarea id="myarea"></textarea>

CSS:

textarea#myarea { width: 100px; height: 20px; }
textarea#myarea:focus { width: 500px; height: 200px; }

depending on the layout, it's sometimes attractive to give the focused textarea position: absolute so it floats above the other elements in its enlarged state.

Pekka 2010-10-01 08:38:24

Answer 2

A:

If you wanna use onClick, add an onClick Handler via JavaScript:

<html>  
    <body onLoad="load();">   
        <textarea id="t1">foo</textarea>
        <script>
        function load(){
            document.getElementById("t1").addEventListener("click",function(){ 
                this.setAttribute("rows","50"); 
            },false);  
        }  
        </script> 
    </body>
 </html>

Hannes 2010-10-01 09:04:15

ansaurus

tags:

views:

answers:

Enlarge textarea onClick

related questions