![html5.png](https://i.iter01.com/images/199a3f8faa1efe4c9956a41d64e8c1dee2f7b2165c464911c59d548df2ba86b5.png)
![html.gif](https://i.iter01.com/images/a1b3641d08fd63796b477fe6f57096050d12041ac55a4c05c1991b7abfc04312.gif)
這個效果做起來挺簡單的。這裡用到了幾個小動畫 。 1.寶劍從上面垂直插下來。(思路:先設定寶劍元素在螢幕上方,即修改y的值,也可以通過修改margin-top來實現) 2.“”尋“”字掉下來並且旋轉。(思路:修改旋轉角度和y或margin-top) 3.標題變大再縮小(思路:CSS3 中的 transform:scale) 4.打字效果(思路:通過setTimeout 不斷呼叫修改 字串 下標,並且輸出 。網上有個有個不錯的jQuery外掛Typed.js,效果也很贊); 5.素材由千庫網提供。