Issues with text formatting after jQuery

I have used code form here: Overflowed text with html in another div - to get text to flow over in a new div. However, now I have formatting issues with the text. The first word of every paragraph is somehow followed by a line-break.

You can see an example here: http://jsfiddle.net/hm2yfw61/9/

var currentCol = $('.box:first');
 var text = currentCol.html();
 currentCol.html('');
 text = text.replace(/ (?![^<>]*>)/gi, '%^%');
 var wordArray = text.split('%^%');



 $.fn.hasOverflow = function () {
     var div = document.getElementById($(this).attr('id'));
     return div.scrollHeight > div.clientHeight;
 };


 for (var x = 0; x < wordArray.length; x++) {
     var word = wordArray[x];
     currentCol.append(word + ' ');
     if (currentCol.hasOverflow()) {
         currentCol = currentCol.next('.box');
     }
 }

Does anyone know how I can fix this?

Thanks.

-----UPDATE: I've updated the jsfiddle with the working solutions suggested in reference for others who may face similar problems ------

Problem courtesy of: Thorbj

我来评几句
登录后评论

已发表评论数()

相关站点

+订阅
热门文章