2

here is the image to explain it

div line

<div id="tshirt">
    <div id="text-wrapper">
        <p id="tshirtover">Nothing is impossible unless we try it</p>
    </div>
</div>

Is there any way to find the length of the first line?

I tried below jQuery function. It's giving the entire length of the string.

$("#tshirtover").text().length;

But i need to find only the first line. Is it possible to get it?

agurchand
  • 1,635
  • 3
  • 15
  • 25
  • is there a line break because it is merely wrapping to a newline? or are you using an actual line break? – Kristian Jul 24 '12 at 07:16
  • @Kristian Im not using any line break there! – agurchand Jul 24 '12 at 07:17
  • what do you meant by "First Line" – Usman Jul 24 '12 at 07:17
  • so it should be calculated as div width/font size ...etc? – Samson Jul 24 '12 at 07:18
  • OK, well in that case, length simply refers to the string in its entirety... without a separator of some kind, you cant do it. so, you may start by trying to add a separator at the wrapping point, and then performing a substring calculation and getting length of that – Kristian Jul 24 '12 at 07:18

1 Answers1

2

the only way I can think of, is to create the empty div (with a fixed width), then start filling in the text character by character, use a counter to store how many characters have been put and also watch the height of the div, as soon as the height changes it means a new line has just started.

Soheil Jadidian
  • 878
  • 7
  • 12
  • If you try this, you will also have to make sure that the object gets relayout after each character too (in all browsers) so that the height is accurate. This might be tricky to code. – jfriend00 Jul 24 '12 at 07:28
  • 1
    @agurchand maybe this post will help some http://stackoverflow.com/questions/783899/how-can-i-count-text-lines-inside-an-dom-element-can-i – Henrik Andersson Jul 24 '12 at 07:33