I’ve created a jQuery plugin that can be used to give the browser an “hint” on when (and eventually how) break some long texts that are wrapped in a container with an explicitely defined width. The purpose is twofold: it can make very long, non-breakable lines wrap automagically (URLs in fixed width container, for example) and/or it adds a more elegant space/non-space text ratio inside little boxes.

The plugin works adding a “special” unicode character after the given number of characters. By default U+200B (the zero width space) is used, but you can specify any other character as the second parameter. Only TEXT nodes are edited (the actual HTML tags and attributes remain untouched).

The plugin must be considered “experimental”, and should be better throughly tested if used in a production environment. Browsers, though, seem very “smart” about those Unicode “spaces” in that they do not mind them other then in a presentation context; in fact, I was in trouble thinking about HTML named entities… well, browsers don’t mind if a \U+200B is present in the middle of a à

Go to the breakly example page or just download it (a little help is present as the plugin comment).

Should you find a bug, please feel free to contact me.

Print