分类目录归档:HTML5应用

HTML5 Canvas 圆形进度条 显示数字百分比

记得以前为大家分享过很多样式各异的进度条插件,有基于jQuery的,也有基于HTML5和CSS3的。这次我们要介绍另外一款基于HTML5 Canvas的圆形进度条应用,在黑色的背景下,白色的进度条显得格外显眼,而且圆形中央会实时显示当前进度的数字百分比,非常实用。

html5-canvas-circle-percentage

在线演示源码下载

CSS3实现3D卡通文字效果

之前我们介绍过很多基于jQuery和CSS3的文字动画特效,比如HTML5/CSS3发光文字 可自定义文字色彩就非常炫酷。今天要分享的是一款基于CSS3的3D卡通文字效果,文字呈现的是3D立体的视觉效果,鼠标滑过文字时会出现晃动的动画效果。

css3-3d-kartoon-text

在线演示源码下载

HTML5 Canvas 随机色彩光束爆炸动画特效

今天我们要给大家分享一款非常炫酷的HTML5 Canvas光束爆炸动画特效,它就像一朵光速爆炸开一样,动画效果非常绚丽。点击鼠标时,可以随机切换光速的颜色,当然你也可以在页面上放几个按钮,通过点击按钮来指定某一种颜色的光束。

html5-canvas-beam-explosion

在线演示源码下载

CSS3实现的公司发展历程时间轴

今天我们要给大家分享一款CSS3和JavaScript实现的时间轴动画,这款时间轴动画有以下几个特点:1、页面加载完成后,时间轴会按节点逐步展开;2、可以自定义节点的数量和位置;3、拥有动态背景动画特效,就像飞舞的棉絮吸附着鼠标,非常炫酷。这款时间轴插件可以应用在公司发展历程功能上,更直观地介绍公司的发展历程。

css3-company-timeline

在线演示源码下载

精美的CSS3登录注册切换表单

今天要给大家分享一个非常有创意的登录注册切换表单,它不仅有着精美简洁的外观,而且表单切换时还会伴随淡入淡出的移动特效。在登录和注册两个界面切换时,整个界面柔和地平移,而且拥有动态的背景图片,不仅炫酷,而且非常实用。

css3-login-reg-switch-form

在线演示源码下载

CSS3实现的火柴燃烧Loading加载动画

这次我们要给大家分享一款非常特别的CSS3 Loading加载动画,整个Loading加载动画就好像是火柴在燃烧一样,不足的是火苗并没有那么真实,比较抽象,不过这款Loading动画还是比较富有创意,非常适合在一些个性化的页面上使用。

css3-matches-loading

在线演示源码下载

纯CSS3精美样式的飘带特效

还记得之前我们分享过一些基于CSS3的飘带样式菜单吗?比如这款CSS3 飘带菜单 超酷3D CSS3菜单CSS3飘带状3D菜单 菜单带小图标。今天我们要给大家介绍另外一种CSS3飘带样式的特效,它非常适合在图片上标注一些文字描述,样式非常精美。

css3-ribbon-text

在线演示源码下载

纯CSS3实现阴阳太极动画

这是一款很有趣的纯CSS3小动画,它是我们中国人都非常熟悉的阴阳太极图案,整个图案是利用纯CSS3绘制而成,而且更酷的是,这个太极图案还会不断旋转,看上去非常的神秘。而且这个旋转动画特效也是利用CSS3的动画属性实现。

css3-yinyang-taichi

在线演示源码下载

纯CSS3绘制可爱的神奇宝贝

CSS3非常强大,之前我们还介绍过很多基于纯CSS3的动画特效,比如纯CSS3绘制的旺仔头像动画,非常可爱。今天我们要为大家分享一款纯CSS3绘制可爱的神奇宝贝动物形象,特别的是,它还会眨眼、摇尾等表情,非常逼真。

css3-pokemon

在线演示源码下载

HTML5 Canvas 3种不同风格的圆盘时钟

这次我们要继续为大家分享一款基于HTML5 Canvas的圆盘时钟动画,和之前分享的这款HTML5 Canvas 圆形时钟动画类似,它也是基于HTML5的,但是这款时钟提供了3种不同的样式风格,而且时钟的大小可以自己控制。

html5-canvas-3-style-clock

在线演示源码下载