jquery break content function
by lamarant
HTML
<div id="main"></div>
CSS
div div {
background: #fff;
padding: 1em;
margin-bottom: 1em;
border-radius: 2px;
}
JavaScript
var content='Boehringer Ingelheim CHC Division called upon the services of Ashtead Performance Group, a consultancy focusing on company cultures, leadership development plus coaching and development of high <b>performance</b> teams to help them with their workplace culture. There was a ‘feeling’ within the division that their structure was too hierarchical. Too many employees were feeling frustrated that they had to refer to senior management to <a href="http://www.google.com">gain authorisation</a> and couldn’t via their own means make things happen. The company wanted to create a ‘Winning Culture’, and knew that changes had to be made to empower employees to become much more entrepreneurial in their attitudes and behaviour.';
// returns an array containing elements with content
function columnize(characters, str, wrapper) {
var n = characters;
var ret = [];
var curLetterPosition = 0;
var len;
var okToBreak = false;
var extraCharacters = 0;
var stringBuilder = '';
var inHTMLTag = false;
var lookForCloseHtml = false;
for(var i = 0; i < str.length; i++) {
stringBuilder = stringBuilder + str.charAt(i);
//determine if we're in an html element
if(str.charAt(i) == '<') {
inHTMLTag = true;
}
if(inHTMLTag && stringBuilder.slice(-2) == '</')
{
lookForCloseHtml = true;
}
if(lookForCloseHtml && stringBuilder.slice(-1) == '>') {
inHTMLTag = false;
lookForCloseHtml = false;
}
//console.log(i + '::' + str.charAt(i) + '::' + inHTMLTag + '::' + lookForCloseHtml);
if(stringBuilder.length % n === 0) {
okToBreak = true; //we are at a break point
}
if(okToBreak) { //we should break at next opportunity
if(!inHTMLTag && stringBuilder.slice(-1) == ' ') {
//character is a space and not in an HTML tag so we can break
var $clone = $(wrapper).clone().append(stringBuilder.trim());
ret.push($clone);
stringBuilder = '';
okToBreak =...