天天看點

8款HTML5動畫特效推薦源碼

1、HTML5 Canvas發光Loading動畫

之前我們分享過很多基于CSS3的Loading動畫效果,相信大家都很喜歡。今天我們要來分享一款基于HTML5 Canvas的發光Loading加載動畫特效。Loading旋轉圖示是在canvas畫布上繪制的,整個loading動畫是發3D的視覺效果,HTML5非常強大。

8款HTML5動畫特效推薦源碼

線上示範

源碼下載下傳

2、jQuery球狀放大鏡特效插

今天我們要來分享一款基于jQuery的放大鏡特效插件,和其他放大鏡不同的是,這款jQuery放大鏡插件是球狀的,看上去有3D的視覺效果。當你把滑鼠滑過頁面上的文字時,即會出現很酷的球狀放大鏡,來放大目前區域的文字。并且以球心為中心點向外文字逐漸變小,這就産生了立體感。

8款HTML5動畫特效推薦源碼

線上示範

源碼下載下傳

3、HTML5 Canvas粒子模拟效果

這是一款利用HTML5 Canvas模拟出來10000個粒子動畫,當你用滑鼠在canvas畫布上移動時,滑鼠周圍的一些粒子就會跟着你移動,并形成一定的圖案,就像你在玩沙畫一樣,效果非常不錯。這裡,我們應用了一些HTML5的特性,讓這個粒子動畫顯得相當動感。

8款HTML5動畫特效推薦源碼

線上示範

源碼下載下傳

4、HTML5/CSS3帶區域地圖的聯系表單

今天我們要來分享一款功能更加強大的HTML5/CSS3聯系表單,它可以選中不同區域顯示相應的地圖,然後針對該區域填寫聯系表單。

8款HTML5動畫特效推薦源碼

線上示範

源碼下載下傳

5、CSS3 3D立方體Loading加載動畫特效

之前我們分享過一些HTML5和CSS3�?D立方體特效,他們都是可以旋轉來展3D立體的效果。這次分享的這款CSS3 3D立方體确是用來做Loading加載動畫的,9個小立方體上下浮動,呈現波浪的效果,并且,這個Loading動畫還利用了CSS3的陰影屬性讓這些立方體更充滿3D色彩。

8款HTML5動畫特效推薦源碼

線上示範

源碼下載下傳

6、基于Bootstrap和CSS3的響應式UI架構

今天我們要來分享一組基于Bootstrap和CSS3的響應式UI架構,這個UI架構中,包含了自定義CSS3按鈕、自定義CSS3複選框和單選框、自定義CSS3下拉框等等,外觀非常漂亮。

8款HTML5動畫特效推薦源碼

線上示範

源碼下載下傳

7、HTML5 Canvas動畫按鈕 點選水波擴散效果

之前我們分享的都是基于CSS3的自定義按鈕,今天我們來分享一款基于HTML5 Canvas的動畫按鈕,每一個按鈕都是一個canvas畫布,這就很靈活,你可以在canvas繪制任意你喜歡的東西作為按鈕的背景畫面,并且,還可以有動畫特效。

8款HTML5動畫特效推薦源碼

線上示範

源碼下載下傳

8、CSS3/jQuery實作Tab菜單小工

幾天要分享一款基于CSS3和jQuery的Tab菜單,這款Tab菜單的外觀非常簡潔清新,tab頁籤的上邊框有加粗的線條,讓這些tab菜單按鈕顯得很有立體感。另外有一點不足的是,tab切換時沒有加入CSS3動畫效果。這款tab菜單可以放到你網頁的側邊欄作為小工具。

8款HTML5動畫特效推薦源碼

線上示範

源碼下載下傳

本文固定連結: http://www.i7758.com/archives/1256.html</>