js/css打字效果

写断打字效果的js.

html:

<p class="typeIn">This is the text typed in manually.This is the text typed in manually.This is the text typed in manually.
This is the text typed in manually.This is the text typed in manually.</p>

javascript:

function typeIn(text,target,speed){
  var length = text.length;
  if(length==0)return;
  $(target).append(text.charAt(0));
  
  var _typeIn = function(text,target,speed){return function(){typeIn(text,target,speed)}};
  setTimeout(_typeIn(text.substr(1),target,speed),speed);
}

function type(target,speed){
   var content = $(target).text();
   $(target).empty();
   typeIn(content,target, speed);
}

type(".typeIn",100);

写完后查看网上的实现：

• http://www.cnblogs.com/dolphinX/p/4087817.html
• https://github.com/mattboldt/typed.js/blob/master/js/typed.js