0

I looked for a plugin that truncates text and adds a (more) link to it based on container height not char limit of text. I couldn't find one.

Looks like ill have to write one myself. The question need to answer is:

Based on the width of a div, and a given height, how much text will fit in there (using font style of that div)?

So far this looks like a promising lead: https://developer.mozilla.org/en-US/docs/DOM/element.getClientRects

mkoryak
  • 57,086
  • 61
  • 201
  • 257
  • Hope you're using monospace fonts. – Asad Saeeduddin Nov 30 '12 at 18:09
  • 1
    I'm surprised you couldn't find anything, I found this in my first Google search: http://shakenandstirredweb.com/240/jquery-moreless-text – Christian Nov 30 '12 at 18:12
  • that plugin is not aware of the text within. change the container height to 70 and the text is cut off. the plugin that i need to write should be aware of how much text can fit into a container. – mkoryak Nov 30 '12 at 18:27
  • Any method you use to do that is going to suck. You _could_ remove words from the end of the paragraph, until the height is less than the parent's height. But that's going to be very inefficient. Obviously you can't precalculate anything because the amount of words will differ depending on what letters exist in the paragraph (unless you use monospace fonts, like Asad mentioned). I guess my question is why would you ever need to know the exact amount of text that's been truncated? – Christian Nov 30 '12 at 18:38
  • You may be right about the sucking part, which is why i asked. maybe there is some arcane api that lets you do this without the technique you mentioned. The reason behind this plugin would be to allow the developer to not worry about the font size of the text in order to properly truncate it. maybe its not worth it. – mkoryak Nov 30 '12 at 18:46
  • There might well be, we'll have to see if anyone else answers. There are more efficient ways to do what I was saying as well, but it's still quite complicated. I get your reasons now, and to be honest I think it's a damn shame that [`text-overflow`](http://www.quirksmode.org/css/textoverflow.html) only works with the `white-space: nowrap` property. – Christian Nov 30 '12 at 18:53

0 Answers0