typewriter.js代码打印机效果

 查看演示  website  立即下载

简单使用方法

1、引用typewriter.js。

2、所要打字效果的html代码

<div id="code"> <span class="comments">/**</span><br />
      <span class="space"/><span class="comments">* We are both XXX Unversity  business administration and programmers,</span><br />
      <span class="space"/><span class="comments">* so I write some code to show my love to you.</span><br />
      <span class="space"/><span class="comments">*/</span><br />
      Boy i = <span class="keyword">new</span> Boy(<span class="string">"boyname"</span>);<br />
      Girl u = <span class="keyword">new</span> Girl(<span class="string">"girlname"</span>);<br />
      <span class="comments">// April 28, 2012, I told you I love you. </span><br />
      i.love(u);<br />
      <span class="comments">// but..., what you said that meaning we are still good friends.</span><br />
      u.sayOtherthing();<br />
      <span class="comments">// Since then, I ask you for the reason.</span><br />
      <span class="keyword">var</span> reason=i.ask(u);<br />
      <span class="comments">// you say we were not understand enough for each other .</span><br />
      $("body").append(reason);<br />
      <span class="comments">// You say that it is too quickily to turn our relation of lover.</span><br />
      <span class="comments">// And take care of u and our love.</span><br />
      i.takeCareOf(u);<br />
      <span class="comments">// So I keep waiting and I have confidence that you will.</span><br />
      <span class="keyword">boolean</span> isAccept = <span class="keyword">false</span>;<br />
      <span class="keyword">while</span> (isAccept) {<br />
      <span class="placeholder"/>i.waitFor(u);<br />
      <span class="placeholder"/><span class="comments">// I think it is an important decision</span><br />
      <span class="placeholder"/><span class="comments">// and you should forgot the unhappy things that happended before.</span><br />
      <span class="placeholder"/>isAccept = u.thinkOver();<br />
      }<br />
      <span class="comments">// After a please sound of accept, we will live happily ever after.</span><br />
      u.accept(i);<br />
      i.liveHappilyWith(u);<br />
  </div>

3、js调用方法

document.getElementById("code").typewriter();

PREVIOUS:
NEXT:
图片带左右箭头滚动+鼠标点击放大效果
分享一个 Bootstrap3 响应式的单页小站