标签归档:HTML5动画

HTML5 Canvas圆盘抽奖应用

记得之前我们分享过一款基于jQuery的圆盘抽奖插件,可以在自己的网站中利用这个插件来给用户提供一些抽奖活动。今天要分享的也是一款圆盘抽奖应用,不过它是基于HTML5 Canvas的,运行原理也类似,都是利用随机数原理来实现开奖结果。

html5-canvas-choujiang

在线演示源码下载

HTML5电子书翻页动画特效

今天我们要来分享一款很酷的HTML5电子书翻页动画特效,这款HTML5翻页动画可以用鼠标拖动页面来模拟手动翻页的效果,也可以点击书页的边框来快速翻页。之前也分享过一款HTML5 3D书本翻页特效,3D视觉效果更加强烈。

html5-book-page

在线演示源码下载

HTML5移动端图片左右切换动画

今天要给大家分享一款很不错的图片左右切换焦点图动画,并且支持移动端触摸滑动。功能上,这款HTML5图片播放器支持鼠标滑动、手机端触摸滑动以及自动播放。外观上,这款HTML5图片切换动画的两侧有淡化处理,因此更显立体效果。

html5-mobile-image-player

在线演示源码下载

很酷的CSS3多窗口邮件阅读器

这是一款非常炫酷华丽的CSS3邮件阅读器界面,它的特点是你可以同时点开多个邮件,而不必跳转页面。当你阅读完后可以点击关闭按钮关闭当前邮件的窗口。对于这种交互式的窗口,之前也分享过一个CSS3聊天窗口,大家也可以关注一下。

css3-cool-mail-reader

在线演示源码下载

HTML5水波浪起伏模拟动画

关于HTML5的波浪特效动画,之前我们已经分享过一些了,比如:HTML5 WebGL水面水波荡漾特效HTML5水波荡漾动画特效等。这次我们要来分享一款基于HTML5的水波浪起伏模拟动画,我们可以设置水的粘度,点击水面即可泛起水波浪,一起来试试。

html5-water-wave

在线演示源码下载

HTML5雨滴滑落动画及天气预报代码

记得上次我们分享过一款超逼真的HTML5 Canvas雨滴下落动画,共有5种效果。今天这次要分享的也是一款基于HTML5的雨滴滑落动画,不同的是这款应用还有天气预报的功能,我们可以通过调用天气相关接口来实现简单的天气预报功能,非常不错。

html5-rain-weather-app

在线演示源码下载

纯CSS3实现大象走路动画

之前我们分享过一款纯CSS3人物行走动画,效果相当震撼。这一次要给大家介绍的是一款纯CSS3实现的大象走路动画,大象走路时的形态表现的十分逼真,你可能不会想到,这么给力的动画居然是用纯CSS3实现的,很可爱的大象,下载源码自己去研究吧。

pure-css3-elephant-animation

在线演示源码下载

HTML5 3D波浪起伏动画特效

今天我们要来分享一款很不错的HTML5 3D动画特效,它是一个波浪起伏的动画效果,跟之前分享的那款HTML5 3D 粒子波浪动画特效不同的是,这款HTML5动画可以拖拽鼠标查看不同角度的波浪效果,同时也可以利用鼠标滚轮来实现视窗的缩放。

html5-3d-wave-animation

在线演示源码下载

HTML5 Canvas可拖动的弹性大树摇摆动画

今天让我们继续来分享一个炫酷的HTML5动画,它是一款基于HTML5 Canvas的大树摇摆动画,这款HTML5动画的特点是我们可以拖拽树枝,从而让整棵树摇摆起来,这样就真实地模拟了大树从摇摆到静止的整个过程,相当逼真。

html5-canvas-drag-tree

在线演示源码下载

HTML5 3D 粒子波浪动画特效

之前我们分享过一个HTML5 3D点阵列波浪翻滚动画,效果非常震撼。今天我们要在来分享一款升级版HTML5 3D粒子波浪动画特效,我们可以旋转不同的视角来欣赏粒子波浪的滚动特效。HTML5在动画制作方面的确让人眼前一亮。

html5-3d-wave

在线演示源码下载