iTyped: 仿文字輸入效果 純 JS 僅 2KB 大小

pqoo5348 7年前發布 | 9K 次閱讀 JavaScript開發 JavaScript

仿文字輸入這個特效很早就有了,比如《 制作有吸引力的文字動畫效果-textillate.js 》有介紹,然而更輕量更簡單,而且不需要 jQuery 庫的 JS,這里我就推薦 iTyped。簡單實用,Tiny 版只有1.9KB 大小,下面來看看介紹。

插件名稱:iType.js

在線演示: https://ityped.surge.sh/

下載地址: https://github.com/luisvinicius167/ityped

小編認為這個方便之處就是不需要 jQuery 庫以及輕量級,而且使用起來不麻煩。

使用教程

STEP 1 : 引入 ityped.js

<script src="https://unpkg.com/ityped@0.0.5"></script>

STEP 2 : HTML 代碼

<span id="ityped"></span>

STEP 3: JS代碼

<script>
ityped.init('#ityped', {
strings:['我是文字一哦', '我是文字二哦', '我是文字3哦', '沒有文字啦。。。'],
startDelay: 200,
loop: true
});
</script>

 

 

來自:http://www.shejidaren.com/ityped.html

 

 本文由用戶 pqoo5348 自行上傳分享,僅供網友學習交流。所有權歸原作者,若您的權利被侵害,請聯系管理員。
 轉載本站原創文章,請注明出處,并保留原始鏈接、圖片水印。
 本站是一個以用戶分享為主的開源技術平臺,歡迎各類分享!