标签：3D动画

爱前端网 - Yang 发布于 2021-11-09

今天要给大家分享一个基于HTML5的3D地球仪动画，地球仪不仅可以自动自西向东旋转，而且还可以旋转到指定经纬度坐标。另外，还有一个控制面板，可以控制地球是否自转、光晕是否显示，以及地理缩放。你也可以通过拖拽鼠标来改变地球仪的视角，可以将它移至南北极的视角，也可以移至赤道的视角，非...

阅读(3065)赞 (16)标签：3D动画 / HTML5 / 地球仪

爱前端网 - Yang 发布于 2021-11-09

今天要分享的又是一个基于HTML5 Canvas的炫酷动画，这是一个3D的陨石火球动画。从外观上看，这就像一颗正在坠落的陨石火球，还拖着一条长长的火焰尾巴。同时，我们可以通过拖拽鼠标从不同的视角来看这颗火球，并且可以通过鼠标滚轮来放大缩小火球，这便让人产生了不错的3D视觉效果。另...

阅读(1264)赞 (2)标签：3D动画 / HTML5 Canvas / HTML5动画

爱前端网 - Yang 发布于 2021-11-09

今天分享的是一个基于纯CSS3的价格表卡片翻转动画，点击切换按钮时，卡片就会以翻转的动画效果进行切换，同时卡片上的装饰物也会以淡入淡出和飞入飞出的动画进行切换。这款卡片切换动画呈现的3D效果是通过纯CSS3实现的，整体看上去清新自然，也十分美观，如果你的网站或者App上需要类似的...

阅读(1456)赞 (2)标签：3D动画 / CSS3

爱前端网 - Yang 发布于 2021-11-09

今天分享的是一个基于Three.js的HTML5 3D动画，这个动画模拟了游戏中的一个炫酷的3D场景，支持360度视角查看，也支持鼠标滚轮进行缩放。画面中主要展现了一个游戏中传送门的效果，同时还有路两边的围栏、灯笼、石头，以及星光闪闪的萤火虫，整个画面显得十分神秘。不得不说，th...

阅读(1039)赞 (2)标签：3D动画 / HTML5 3D / HTML5动画 / Three.js

爱前端网 - Yang 发布于 2019-08-09

很多现代网站现在都喜欢用卡片式的风格，即在首页中将文章标题、内容和主题图片制作成卡片展示。今天这款就是基于CSS3的卡片动画，卡片中的元素可以是任意HTML元素，这里比较特别的是在文字下方显示一个3D按钮，同时当我们将鼠标滑过卡片时，卡片会呈现3D的翻转动画。 在线演示 源码下载

阅读(4120)赞 (18)标签：3D动画 / CSS3

爱前端网 - Yang 发布于 2019-08-09

今天给大家分享一个很酷的HTML5 Canvas 3D动画，它同样是一个基于Three.js制作的动画特效。在Canvas上有一个用许多长度各异的水晶柱形组成的球体，我们还可以用鼠标拖拽球体来从不同角度观察球面，还可以用鼠标滚轮来缩放球面。还有一个特性就是，双击球面可以改变水晶面...

阅读(2694)赞 (3)标签：3D动画 / HTML5 Canvas / HTML5动画 / Three.js