系統(tǒng)下載、安裝、激活,就到系統(tǒng)天地來!

網(wǎng)頁炫酷打字特效

作者:系統(tǒng)天地 日期:2018-09-03

有盆友問博主關(guān)于評論框打字特效是怎么實(shí)現(xiàn)的?所以更新了這篇教程,源自是《打字特效》的詳細(xì)版。(代碼可以關(guān)注后私信作者demo004獲取)

 

網(wǎng)頁炫酷打字特效

 

重申一遍,最初見到這個(gè)打字特效是在atom編譯器中,有一個(gè)打字特效插件(activate-power-mode)。效果如下圖,atom和特效插件的安裝過程問百度就行啦,這里不做介紹。

 

網(wǎng)頁炫酷打字特效

 

歡迎主角

有請我們這次介紹的主角,js版activate-power-mode,github倉庫地址github.com/disjukr/activate-power-mode。

倉庫下的README.md有介紹食用方法:

 

網(wǎng)頁炫酷打字特效

 

現(xiàn)將其下載下來:

 

網(wǎng)頁炫酷打字特效

 

解壓縮后的文件如下:(我們需要的js文件在dist文件夾下)

 

網(wǎng)頁炫酷打字特效

 

在目錄下新建一個(gè)index.html,插入如下代碼

 

網(wǎng)頁炫酷打字特效

 

食用注意事項(xiàng):

注意js引入路徑是否正確 只要有js的input事件都會觸發(fā)(試過改成click,只有鼠標(biāo)點(diǎn)擊的時(shí)候會觸發(fā))

瀏覽器打開效果:

 

網(wǎng)頁炫酷打字特效

 

是不是很簡單,這篇教程就到這里啦。