HTML5的确可以制作出非常绚丽的网页动画效果，尤其是利用HTML5 Canvas特性和HTML5 3D特性，我们更加可以欣赏到超酷的动画特效。今天我从html5tricks网站上整理了8款令人惊叹的HTML5 Canvas动画教程，大家可以一起来看看。
1、3D HTML5 Logo动画 HTML5多视角3D旋转动画
HTML5 3D动画实现起来非常方便，之前介绍过基于jQuery的3D旋转插件是利用多张多视角图片播放来实现的，而今天分享的这款HTML5 3D旋转动画是利用纯HTML5技术实现的，该动画实现了HTML5 Logo旋转的效果。
在线演示 源码下载
2、HTML5版Flappy Bird游戏 仅65行Javascript代码
Flappy Bird相信大家都很熟悉了，2014年最热门的手机游戏之一。Flappy Bird这款游戏是一位来自越南河内的独立游戏开发者阮哈东开发，形式简易但难度极高的休闲游戏，很容易让人上瘾。今天我们用HTML5来重写这款Flappy Bird游戏，值得注意的是，利用Phaser框架，只需65行Javascri[......]
阅读全文>>
2022-10-20 23:44:29
224KB
1
实现类王者荣耀游戏的英雄人物（妲己+典韦+后羿+凯+兰陵王+鲁班七号+孙悟空+亚瑟），可自由切换八类英雄和皮肤，压缩包里包含八类英雄+皮肤模型、技能特效、已编译好的apk手机安装包。源码放在百度网盘里，内附百度网盘地址
2022-10-20 21:06:03
63.71MB
1
jQuery仿微信支付输入密码代码是一款仿手机微信支付密码输入框，浮动弹出数字键盘输入密码完成支付。
$(function(){
//出现浮动层
$(".ljzf_but").click(function(){
$(".ftc_wzsf").show();
});
//关闭浮动
$(".close").click(function(){
$(".ftc_wzsf").hide();
$(".mm_box li").removeClass("mmdd");
$(".mm_box li").attr("data","");
i = 0;
});
//数字显示隐藏
$(".xiaq_tb").click(function(){
$(".numb_box").slideUp(500);
});
$(".mm_box").click(function(){
$(".numb_box").slideDown(500);
});
2022-10-20 20:46:51
46KB
1
这是一款使用纯CSS3制作的鼠标滑过图片遮罩层动画特效。该特效中，当鼠标滑过或悬停在图片上面时，会在图片上出现遮罩层动画，展示出图片的描述信息和链接图标按钮。
2022-10-20 11:01:26
136KB
1
HTML5 CSS3音量调节旋转按钮是一款基于jQuery CSS3 HTML5实现的音量调节旋转按钮，只要按住鼠标即可旋转按钮来调节音量。
2022-10-19 19:17:23
69KB
1
AE系统性知识体系构建+全顶级案例讲解，资深MG动画讲师带你飞，7年动态设计经验，专精MG动漫、图形特效、UI动效领域，手把手传授给你独家秘籍。
2022-10-19 14:08:33
15.8MB
1