Expandable <textarea> ?

Discussion in 'HTML & Website Design' started by heavener, Jul 14, 2008.

  1. #1
    I've looked through Google and this site and couldn't find what I was looking for, so here it is:

    I have a textarea in my HTML and I want it to expand vertically when the user types more characters than the set height. Also, if a section or chunk of text is deleted, the expanded textarea needs to decrease in size, ultimately back to it's original set height if need be.

    When I Google searched it, I got a few pages that showed me how to expand it with Javascript, bit it didn't decrease when text was deleted. There was also one that worked perfectly, but it used JQuery, and I don't want to use JQuery. I'd like to use just one simple script. It may be in Javascript, PHP, whatever, I just need to figure it out.

    I know, in Internet Explorer, you can use the style overflow: visible, but it doesn't work in Firefox... and besides, IE isn't really standards compliant anyways, so I want to find a proper way to do it.

    Can someone share their thoughts on how to do this, please?

    Thanks all.
     
    heavener, Jul 14, 2008 IP
  2. rebelagent

    rebelagent Well-Known Member

    Messages:
    876
    Likes Received:
    46
    Best Answers:
    0
    Trophy Points:
    165
    #2
    That sounds like a job for a super pro. I'd suggest a custom JavaScript code. Shouldn't be hard to find. It was a programming language widely uses a few years ago and a lot people still carry the knowledge of how to write custom scripts.

    Try hiring someone to modify an existing script. Like the one you found that wouldn't shrink. Or try finding the attributes/values that might affect it and play around with it. The one you found it obviously had a code that made it grow find out what it is and try to find the opposite of it.

    And maybe there is a function like onDelete (shrink()) or something...you see what I'm getting at?
     
    rebelagent, Jul 14, 2008 IP
  3. Stomme poes

    Stomme poes Peon

    Messages:
    3,195
    Likes Received:
    136
    Best Answers:
    0
    Trophy Points:
    0
    #3
    Changing form elements is quite difficult, and browsers are picky, so this might be something that a good coder with excellent knowledge of how browsers handle forms needs to do. Make sure you check in Safari-- Safari users have been able to change the height and width of their textareas for some time now (try it).
    Also make sure the script doesn't mess with the textarea when those without scripting use the form.
     
    Stomme poes, Jul 15, 2008 IP
  4. campolar

    campolar Peon

    Messages:
    2,683
    Likes Received:
    244
    Best Answers:
    0
    Trophy Points:
    0
    #4
    try this:
    
    <textarea cols="20" rows="1" onclick="this.cols=40;this.rows=25" onblur="this.cols=20;this.rows=1"></textarea>
    
    HTML:
    add to my reputation if i helped :D
     
    campolar, Jul 15, 2008 IP