标签归档:HTML5 3D

HTML5 3D 卡片视频播放器 超立体视觉

这是一款基于HTML5的视频播放器,不过你一眼看上去,它并不像一款播放器,而是一张张3D立体的卡片,没有播放按钮,没有音量设置。不过它的特色就是把HTML5视频播放器嵌入到卡片里面,然后这些卡片可以和用户互动,并产生HTML5 3D的效果,非常不错的创意。点击卡片即可播放视频。

html5-3d-card-video

在线演示源码下载

HTML5 Canvas 3D 倒计时爆炸特效

今天要分享的这款 HTML5 3D 动画特效非常给力,它是一个基于Canvas 的倒计时爆炸效果,随着时间的走动,时间数字傍边就会有爆炸的特效,一群像素点就会在数字中心爆发出来,感觉非常酷。而且应用了 HTML5 的 3D 特性,让整一个时钟显得非常有立体感。

html5-canvas-3d-explod-clock

在线演示源码下载

HTML5 3D立体图片相册

HTML5非常强大,尤其是和CSS3结合,有时候能达到非同凡响的网页动画效果。今天要分享的这款HTML5应用就是一款很酷的3D立体图片相册应用,它可以用鼠标多拽从多个角度浏览相册图片,点击图片,就可以放大图片,相册图片都是美女,千万别让女朋友看到。

html5-3d-image-gallery

在线演示源码下载

HTML5 Canvas 3D旋转物体动画 模糊发光特效

HTML5 3D动画应用非常广泛,我们之前也分享过很多炫酷的HTML5动画应用。今天要介绍的这款HTML5 3D动画是一个旋转的物体,并且利用CSS3的特性,物体会发出模糊和发光的动画特效,旋转起来效果特别酷。

html5-3d-rotation-with-shine

在线演示源码下载

HTML5 3D立方体阵列 有规律的旋转动画

这是一款基于HTML5的3D立方体动画特效,特别的是,它不是一个立方体,而是由多个立方体组成的立方体阵列,同时阵列中的每一个立方体都会有规律的旋转,从而产生很酷的动画效果。之前我们也分享过一些HTML5立方体动画,比如CSS3 3D立方体动画 表面颜色可渐变

html5-3d-cube-list-1

在线演示源码下载

HTML5 3D相册图片轮播动画

这是一款基于HTML5和CSS3的3D相册浏览插件,它可以将相册中的图片以3D的方式展示出来,并且你可以滑动下面的滑杆来滑动图片浏览,同时,我们也可以指定数字让其直接跳转到指定的图片。这款HTML5 3D图片轮播动画用起来非常棒。

html5-3d-gallery-animation

在线演示源码下载

HTML5 3D弹簧线圈动画特效

这是一款基于HTML5的3D动画特效,它是一个线圈弹簧,并且可以像波浪一样运动,就像真实的弹簧一样,每一圈的弹簧都会跟随上一圈的运动而运动,非常逼真。之前我们也分享过一款CSS3弹簧线圈动画,效果也很不错。

html5-3d-raindrop-animation

在线演示源码下载

HTML5/CSS3 3D焦点图 支持鼠标滚轮

记得以前给大家分享过一款很酷HTML5 3D相册,不知道你有没有研究过源码。今天我再向大家分享一款基于HTML5和CSS3的焦点图相册,在浏览图片时,没激活的图片并不是完全隐藏,而是以3D半透明的方式陈列在主图旁边。值得注意的是,这款HTML5 3D焦点图支持鼠标滚轮来切换图片。

html5-css3-carousel

在线演示源码下载

HTML5/CSS3立方体翻转3D全屏焦点图

今天我们要来分享一款非常大气的HTML5/CSS3 3D全屏焦点图,在页面两侧,有两个很立体的左右箭头进行图片切换。这款HTML5焦点图的图片切换方式是3D效果的,类似立方体翻转一样,焦点图默认显示文字,我们已经将文字替换成图片,效果更酷。

html5-3d-cube-image-player

在线演示源码下载

HTML5 3D立方体动画 立方体可任意翻转

之前我们分享过很多基于HTML5的立方体动画了,有些是基于Canvas的动画特效,比如这款HTML5 webkit 3D立方体图片旋转滑块应用,就很不错。这次要分享的这款HTML5 3D立方体动画比较普通,它可以自己不停的旋转以凸显其3D的魅力。

html5-3d-cube-animation

在线演示源码下载