CODEWITHSUNDEEP
javascriptjqueryhtml
RestingRobot
RestingRobot

Reputation: 2978

Detect word wrap in contenteditable span

I have contenteditable span with a max-width setting that allows the user to enter text. What I'm looking to do is detect when the user reaches this width limit and a new line is displayed on the page. I am trying to create a WYSIWYG editor that creates text, (in SVG), exactly the way it looks in the contenteditable span when the user presses enter. I have successfully captured the enter event, so that is not an issue, I am looking for a way to either detect the word wrap, or calculate where it should occur. Any help is appreciated. (I can post sample code if needed)

Upvotes: 1

Views: 3031

Answers (2)

Jason
Jason

Reputation: 1784

Monitor for a change event and see if the height changed. If it did, you have a word-wrap (or un-wrap). I threw together an example:

http://jsfiddle.net/eZDRD/

Upvotes: 2

Diodeus - James MacFarlane
Diodeus - James MacFarlane

Reputation: 114377

When the height of the element changes, you know you have word-wrap occurring.

Upvotes: 5

Related Questions