近期剛剛接到為微信公眾帳號“玩轉三里屯”制作首頁的任務。 考慮到頁面僅僅在手機中瀏覽。並且手機對canvas的支持又很好，所以打算使用canvas做點不一樣的動畫。 首先來看下效果圖。 要實現這種動畫普通的CSS3是鞭長莫及了，僅僅能使用Canvas。好在使用 ...

首先，效果圖為： H5代碼為 樣式設計CSS： 最重要的就是js代碼了。這里一步步來實現上述粒子效果。 通過看圖我們可以發現，就是由很多圓點跟線條組成的動態效果，那么要實現的就是繪制N個圓形，以及在一定距離內的兩個原點之間連線。 1.首先獲取 ...

效果： 用到圖片下載： 自定義View： 調用: 調用布局： 清單文件配置： ...

加入繪制字母 ...

一款酷炫的前端動態頁面 廢話不多說 ，分享一款酷炫的頁面動態背景 效果見下圖。 查看 demo 背景圖效果： 實例效果 點擊效果： 背景 ...

是鞭長莫及了，只能使用Canvas。好在使用canvas也非常簡單。 Step1. 新建一個畫布（< ...

本文將會從水波的基本原理開始，詳細講解在canvas中模擬水波擴散，分析並計算水波的能量分布，並通過振幅模擬水波對圖像的折射效果，最后實現水波特效。 水波基本原理 首先復習一波高中物理知識。 波是指振動的傳播。波的傳播方向與質點振動方向垂直的為橫波，相同則為縱波，水波是橫波和縱波的疊加 ...

...