typed.js是一款模拟控制台打印文字效果的js插件。typed.js可以自由的控制要打印的文字,以及打印的速度等,可以制作出逼真的打印文字效果。
安装
可以通过bower来安装typed.js插件。
bower install typed.js
使用方法
在页面中引入jquery和typed.js文件。
HTML结构
使用一个元素来作为打印控制台容器。
初始化插件
可以通过纯js的方法来初始化type.js插件。
document.addEventListener("DOMContentLoaded", function(){
Typed.new(".element", {
strings: ["First sentence.", "Second sentence."],
typeSpeed: 0
});
});
也可以将typed.js作为jquery插件来使用。
$(function(){
$(".element").typed({
strings: ["First sentence.", "Second sentence."],
typeSpeed: 0
});
});
CSS样式
你需要使用下面的css样式来添加光标的闪烁效果。
.typed-cursor{
opacity: 1;
-webkit-animation: blink 0.7s infinite;
-moz-an