推薦8款HTML5相關的特殊效果
HTML5是HTML的升級版,HTML5有兩大特點:首先,強化了 Web 網頁的表現性能。其次,追加了本地數據庫等 Web 應用的功能。廣義論及HTML5時,實際指的是包括HTML、CSS和JavaScript在內的一套技術組合。今天我們推薦8款使用HTML5生成的特殊效果,希望可以對大家的使用帶來幫助!
HTML5實現的五子棋游戲
在線演示
這是一款使用HTML5實現的五子棋特效,與計算機的對局你不見得能次次都贏得勝利,不信可以點擊在線演示。
一款不需要視頻文件的視頻播放器-Frame player
在線演示
HTML5視頻是非常棒的,它可以很容易的用在多款設備上。但是它也有自己的問題,比如移動設備的播放器,可能有不同版本不兼容的情況。今天我們介紹這款視頻播放器完善了之前的效果,用起來更方便。希望大家喜歡!
3D菜單
在線演示
或許在現如今這個科技發達的時代,在線點餐已不是新鮮事。餐廳可以對Menu進行設計,點擊菜名會相應彈出菜品的照片,或者還可以增加卡路里,原材料和客戶們的評價等。絕對是一個超時髦的創意!
用HTML5的畫布實現撕布的動畫效果
在線演示
用HTML5的畫布實現撕布的效果,滑動鼠標,布會隨著鼠標變動。點擊鼠標左鍵,然后滑動鼠標,布就會被割開。如果你還沒有查看過這款演示效果,那絕對逼真的讓你震撼!
HTML5 Canvas(畫布) 基礎使用和介紹
在線下載
還記得在過去的Web前端開發中,如果你需要繪圖或者生成相關圖形的話,使用Flash可能是你唯一或者說最強大的實現方式,而在近些年的技術熱點HTML5標準中,HTML Canvas(畫布)能夠更加方便的幫助你實現2D繪制圖形圖像及其各種動畫效果功能。在今天的這篇技術教程中我們將介紹基本的Canvas使用,希望大家覺得有幫助!
HTML5畫布生成的2D光源效果
在線演示
超金屬的背景,仿佛探照燈的經過讓他看上去更加的立體。這是一款使用HTML5 Canvas生成的2D光源效果。絕對讓你不后悔使用它!
HTML5的Flappy bird實現
在線演示
著名的Flappy Bird,相信知道的人一定不少吧,點擊你的空格,不要讓它掉下來,看看你最終的成績有多好。發上來我們切磋一下吧.
Sonic - 循環加載的利器
在線演示1 在線演示2 在線演示3
Sonic是一個不到3k,非常小的JS類庫,你可以用這個類庫來創建自定義的加載動畫。它的循環動畫效果非常贊,比如你可以用它做一條不斷追逐自己尾巴 的蛇,這樣的動畫。Sonic使用了HTML5的canvas元素和其相關API。它基于在一定小的時間間隔上,基于預定義的路徑,畫出下一個形狀,從而 完成動畫效果。你可以使用arc,bezier,或line的方法來定義路徑。
本周推薦的8款HTML5生成的特效,希望對大家有所幫助!歡迎加入極客標簽,我們期待你的分享!
原文來自:推薦8款HTML5相關的特殊效果