zoukankan      html  css  js  c++  java
  • 最牛的打字效果JS插件 typing.js

    原文:http://www.cnblogs.com/coffeedeveloper/p/3852894.html#2989479

    项目网站:http://coffeedeveloper.github.io/typing.js/index.html

    最新在做公司的一个项目,需要实现一个敲打代码的动画效果,粗意味比较简单,果断自己直接开写,写着写着发现是一个坑。需要支持语法高亮,并不能直接简单的用setTimeout来动态附件innerHTML。苦思猛想数小时后,果断用动态生成DOM的方法实现了整个效果。

    typing.js的打印效果甚至能够支持表格、按钮、表单,只要你页面能够呈现出来的,都可以以一种动态输出的感觉打印出来! 强烈推荐观看完整DEMO

    我在网上查了一下,应该目前是没有一个插件是和typing.js效果一致的!

    浏览器兼容性方面已经测试通过(IE8-11、chrome、firefox、safari),由于虚拟机的镜像丢失了,暂时没有测试IE6-7。目测是没有任何问题的。

    低版本的IE需要手动引入es5-shim文件

    <!--[if lt IE 9]>
      <script src="//cdnjs.cloudflare.com/ajax/libs/es5-shim/3.4.0/es5-shim.min.js"></script>
    <![endif]-->

    typing.js使用非常简单,在页面底部或者Ready事件中执行相关代码。

    <script>
      var typing = new Typing({
        source: document.getElementById('source'),
        output: document.getElementById('output'),
        delay: 80
      });
      typing.start();
    </script>
  • 相关阅读:
    ANSI C
    如何判断机器的endianness
    union的常见用法
    主流浏览器引擎
    用宏来求数组元素个数
    inode
    分区时"磁盘上没有足够的空间完成此操作"的解决方法
    删除OEM分区
    jquery加table布局 模仿实现FaceBook Dialog
    Container.DataItem使用
  • 原文地址:https://www.cnblogs.com/shihaiming/p/6210498.html
Copyright © 2011-2022 走看看