超酷震撼 HTML5/CSS3动画应用及源码

HTML5可以制作非常华丽的动画效果，这点通过之前的分享学习我们已经有深刻的了解了，今天我们主要来分享一些HTML5结合CSS3形成的超炫震撼的动画应用以及它们的源代码，真的非常不错。

1、纯CSS3创意Loading加载动画

今天要来分享一款非常具有创意的CSS3 Loading动画效果，整个Loading动画就像一部开足马力的发动机，在不停地循环工作，看上去Loading动画样式十分新颖。之前我们也分享过一些创意型的Loading动画，比如：HTML5 Canvas发光Loading动画

在线演示

源码下载

2、HTML5梦幻特效可给任意元素添加魔幻效果

我们之前介绍HTML5动画特效比较多的是HTML5 3D特效，今天我们来换一种风格，来分享一款看起来比较魔幻的HTML5特效。它可以给网页上任意元素（图片、文字等）添加这么一种效果，即鼠标滑过时，元素上就会出现非常魔幻的动画特效，什么特效呢？你可以点开demo链接查看。

在线演示

源码下载

3、纯CSS3实现Metro风格的图标按钮

今天我们要来分享一款基于纯CSS3的按钮图标，这款CSS3图标是Metro风格的，外观非常清新漂亮。同时，当鼠标滑过图标是，还会在图标上方滑过文字描述，带飞入飞出的动画特效。另外也有一些图标有放大缩小的动画效果。

在线演示

源码下载

4、CSS3个人资料菜单导航带下拉表单

今天要分享的这款CSS3菜单非常华丽，而且也相当实用。每一个菜单项都有很不错的小图标，并且在鼠标滑过菜单项时，菜单项的背景颜色出现淡入淡出的效果。另外这款菜单还有一个特点就是下拉子菜单可以嵌入表单，功能十分强大。

在线演示

源码下载

5、HTML5重力感应动画特效冲撞小球演示

前面我已经向大家分享过一款非常绚的HTML5重力感应游戏特效，我们只需要用鼠标甩动页面上的元素就可以实现模拟重力感应的效果。今天这款HML5重力感应动画特效功能更强，页面上会掉落大小不等的小球，我们可以拖动小球，也可以点击页面空白来生产更多的小球，如果你的电脑配置高，可以试试产生更多的小球来玩，非常有趣。

在线演示

源码下载

6、CSS3图片边框动画特效

今天要来分享一款基于CSS3的图片特效，这款CSS3图片应用的作用是增强图片边框的效果，当我们将鼠标滑过图片时，图片的边框就会产生非常棒的动画效果，边框形成一些伴有动画特效的条纹效果，让图片变得更具有魅力。

在线演示

源码下载

7、CSS3个性化风格菜单导航

这是一款基于纯CSS3的菜单导航，这款菜单非常有个性，菜单背景是一页古老的笔记本纸张，菜单项像是浮动的文字一样嵌入在纸张上。鼠标滑过菜单项时会出现不同的背景线条，显得相当可爱。这款CSS3菜单导航非常适合在个人博客中使用。

在线演示

源码下载

8、简单实用的CSS3自定义下拉Select表单

今天要再来分享一款基于纯CSS3的自定义下拉select表单，这款CSS3自定义下拉表单和之前分享的相比，没有华丽的外表，但是非常清爽简单，而且功能更接近原始的select表单。我们可以将这款CSS3自定义select表单应用在很多地方，比如注册和登录等。

在线演示

源码下载

本文固定链接: http://www.i7758.com/archives/1235.html

专注前端开发，关注用户体验: http://www.i7758.com
WEB前端交流中心