1、HTML5 Canvas發光Loading動畫
之前我們分享過很多基于CSS3的Loading動畫效果,相信大家都很喜歡。今天我們要來分享一款基于HTML5 Canvas的發光Loading加載動畫特效。Loading旋轉圖標是在canvas畫布上繪制的,整個loading動畫是發光3D的視覺效果,HTML5非常強大。
Sonic.js 是一個很小的 JavaScript 類,用于創建基于 HTML5 畫布的加載圖像。更強大的是 Sonic.js 還提供了基于現成的例子的創建工具,可以幫助你實現更多自定義的(Loading)加載動畫效果。
Html5在移動設備上表現搶眼,幾乎所有稍微高端一點的設備(喬幫主的iPad,iPhone和Andriod的平板手機等)的瀏覽器都支持Html5。而且據我個人的測試這些支持html5的設備對canvas標簽的支持是相當的好。
所以就看了一點html5的東東,并研究了一下canvas標簽的用法
我們都知道 HTML 5里面的 canvas 是一個矩形 你可以做的事情有很多 只要在這個矩形里面就行 。
原理: 在一個canvas 里面循環的去畫弧 要想圓弧連貫就要控制每一次擦除和繪制的間隔 ;
|