打字效果的JS库TheaterJS
在之前的文章里也介绍了一个打字效果的jQuery插件-typer.js。今天再给大家分享一个模拟人类打字的js插件TheaterJS，TheaterJS功能更加丰富，包含多个角色管理、事件处理等。
1、引入TheaterJS.js
1 | <script src="path/to/theater.js"></script> |
2、TheaterJS.js的使用
1 2 | <div id="raykaeso"></div> <div id="leixuesong"></div> |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 | <script src="path/to/theater.js"></script> <script> //TheaterJS初始化 var theater = new TheaterJS(); //描述角色 theater .describe("raykaeso", .8, "#raykaeso") .describe("leixuesong", .6, "#leixuesong"); // 写剧本 theater .write("raykaeso:leixuesong.", 600) .write("leixuesong:What?", 400) .write("raykaeso:I am...", 400, " your friend."); // 监听事件 theater .on("say:start, erase:start", function () { // add blinking caret }) .on("say:end, erase:end", function () { // remove blinking caret }) .on("*", function () { // do something }); </script> |
TheaterJS.js github地址：https://github.com/Zhouzi/TheaterJS
2019年5月5日 下午7:43
好文章！666，学习了
2019年5月8日 下午7:55
哇塞，居然是沙发？留个名
2019年5月9日 上午1:05
好文章！666，学习了
2019年5月10日 下午2:28
非常精彩的文章，引人入胜，痛快淋漓。感谢楼主分享。