jquery - Limit number of lines (rows + Enter key press) in Text area plus show Line Count -

jquery - Limit number of lines (rows + Enter key press) in Text area plus show Line Count -

i looking find way using jquery / html / or css following.

my text area fixed size, 1 font size/type, , want able following.

limit number of lines 18 lines display number of lines user has used far (kind of twitter approach characters displaying lines used)

line definition: line project either when user presses come in on keyboard , goes new line, or when new row / line created in textarea naturally typing continuously int textarea. have fixed size textarea , user cannot go outside these limits set.

i not provide code snippets problem approach of how i'm seeing solution. basing algorithm on font.js javascript library, retrieve length in pixels of text , of caracters in text. if you're using unique font in textbox know when line completed each time number of pixels in line equals or inferior actual number of pixels used in new line. in pseudo-code :

var textboxlineinpixels = 300 //or getting actual number through dom; onchangeevent { var totalnumberofpixels = getnumberofpixelsfromelement(idtoyourtextbox); var numberoflinesused = totalnumberofpixels / textboxlineinpixels; update(idtoyournumberoflinescontainer, numberoflinesused); }

dividing total number of pixels in textarea the number of pixels in line give current number of lines used in textarea.

jquery html textarea limit rows