伙计们,我想把我的打字文本改为两行.
这是我的Demo
Plz检查此代码
HTML
<div id="container"> <div class="writer">Hi! This is a test text. <br><br> Can any one Help me in this ?.</div> </div>
JAVA SCRIPT
var txt = $('.writer').text(); var timeOut; var txtLen = txt.length; var char = 0; $('.writer').text('|'); (function typeIt() { var humanize = Math.round(Math.random() * (200 - 30)) + 30; timeOut = setTimeout(function() { char++; var type = txt.substring(0,char); $('.writer').text(type + '|'); typeIt(); if (char == txtLen) { $('.writer').text($('.writer').text().slice(0,-1)); // remove the '|' clearTimeout(timeOut); } },humanize); }());
解决方法
您可以向.writer添加
white-space: pre-line;
声明以断开行,如下所示:
.writer { font:bold 23px arial; white-space: pre-line; }
07002
pre-line
This value directs user agents to collapse sequences of white space. Lines
are broken at preserved newline characters,and as necessary to fill
line Boxes.
值得注意的是前期值is supported in IE8+.