分享9款最新超酷HTML5/CSS3应用插件

新的一周开始了,小编继续要为大家分享实用超酷的HTML5应用,今天分享的这9款最新HTML5/CSS3应用你一定会很喜欢,一起来看看。

1、HTML5 Canvas模拟衣服撕扯动画 超级逼真

今天又要来推荐一款HTML5 Canvas动画,是一个模拟衣服撕扯动画,效果非常逼真。刚开始衣服挂在绳子上,用鼠标拖拽衣服即可让衣服摆动起来,当你拖拽的很用力时,你会发现,衣服被撕破了。该HTML5动画会捕获到鼠标拖拽的用力程度,从而来判断并实现衣服应该破损的程度,越用力,衣服被撕破的速度越快,赶紧来体验一下这个HTML5动画吧。

分享9款最新超酷HTML5/CSS3应用插件_第1张图片

在线演示         源码下载

2、纯CSS3绘制可爱小男孩动画 超酷面部表情

之前我们分享过几个纯CSS3动画特效,比如 纯CSS3人物行走动画就非常酷,还有 纯CSS3 Android Logo动画绘制也很酷。今天我们又要来分享一款纯CSS3绘制的可爱小男孩动画,除了绘制的小男孩逼真可爱外,其面部表情也十分酷。整个动画是利用纯CSS3实现,没有用图片和JS,不知道你们的浏览器中效果怎么样。

分享9款最新超酷HTML5/CSS3应用插件_第2张图片

在线演示         源码下载

3、HTML5 3D图片折叠特效 超炫酷图片特效

我们之前介绍过很多HTML5 3D图片效果,比如 HTML5/CSS3 3D环形图片墙、 HTML5 3D相册浏览等等。今天我们再来分享一款HTML5 3D图片折叠特效,鼠标滑过图片时,折叠好的图片便会展开,鼠标离开图片时,图片又会折叠起来,效果非常酷。

分享9款最新超酷HTML5/CSS3应用插件_第3张图片

在线演示         源码下载

4、HTML5 3D骨牌图片特效 带文字描述

今天分享一款很特别的HTML5 3D图片特效,当鼠标滑过图片时,平面的图片即会呈现3D的效果,和这款 HTML5 3D图片折叠特效类似,也是通过鼠标滑过来展现3D效果。另外,这款HTML5 3D骨牌图片特效还可以设置图片描述信息。

分享9款最新超酷HTML5/CSS3应用插件_第4张图片

在线演示         源码下载

5、HTML5/CSS3 3D立体功能按钮 超酷CSS3按钮

之前我们分享过很多精彩的CSS3按钮,像这款 纯CSS3 3D牛奶样式按钮,非常酷,还有这款 CSS3发光社会分享按钮,也挺不错的。今天要分享的这款CSS3 3D按钮十分大气,按钮在点击的时候也有立体的效果,非常酷的一款CSS3 3D按钮。

分享9款最新超酷HTML5/CSS3应用插件_第5张图片

在线演示         源码下载

6、HTML5/CSS3原图对比查看特效 HTML5图片特效

说到HTML5图片特效,我们应该已经分享过很多了,大家可以到 HTML5图片栏目中查看。今天我们再来看一款不一样的HTML5图片特效,这款HTML5应用可以将两张相似的图片进行细节上的对比,我们只需移动鼠标即可以观察到两张图片的不同点,非常实用方便。

分享9款最新超酷HTML5/CSS3应用插件_第6张图片

在线演示         源码下载

7、HTML5相册照片浏览器 可连接Flickr照片服务

以前我们经常会分享一些jQuery相册浏览插件,效果不错,实用性也很强。不过如果能利用HTML5来实现相册浏览器,那么相册浏览效果肯定会更加炫酷。今天分享的这款HTML5相册浏览器可以连接到Flickr获取照片,也可以连接到youtube获取视频,照片在初始化的时候有波浪般的效果。

分享9款最新超酷HTML5/CSS3应用插件_第7张图片

在线演示         源码下载

8、HTML5/CSS3 3D下拉折叠菜单 超炫CSS3菜单动画

之前我们介绍过很多CSS3菜单了,效果都十分华丽炫酷,但是这些CSS3菜单基本都是二维平面菜单,今天要分享的这款HTML5/CSS3菜单却是3D的效果。菜单展现时出现折叠下拉的动画特效,菜单也可以收起,鼠标滑过菜单项的效果也很不错。

分享9款最新超酷HTML5/CSS3应用插件_第8张图片

在线演示         源码下载

9、HTML5 3D旋转图片相册 可鼠标悬停

图片特效在HTML5应用中十分广泛,我们也在html5tricks上收集了不少 HTML5图片特效,今天要分享的这款HTML5 3D旋转图片相册又非常绚丽,和之前分享的这款 HTML5/CSS3 3D环形图片墙类似,也是一面立体的图片墙,图片不停的切换,鼠标滑过图片时即可激活图片查看。

分享9款最新超酷HTML5/CSS3应用插件_第9张图片

在线演示         源码下载

以上就是9款最新超酷HTML5/CSS3应用插件,欢迎收藏分享。( www.html5tricks.com)

你可能感兴趣的:(HTML5应用,HTML5实例)