标签:Three.js

WEB前端

HTML5圣诞礼物大炮发射3D动画

1

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

今天给大家带来一款基于HTML5的圣诞礼物大炮发射动画,这个动画主要是构造了一个3D的卧室场景,我们通过点击鼠标让一门大炮可以源源不断地发射各种各样的圣诞礼物,并且伴随大炮发射的声音,显得非常逼真有趣。这个HTML5动画主要算法是一些物体的碰撞检测,以及物体碰撞时的运动方向计算,...

阅读(1986)赞 (18)

WEB前端

基于Three.js的图片撕碎切换动画

1

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

这次要给大家带来一个特别炫酷的HTML5 Canvas图片切换动画,它是基于three.js动画库实现的,主要动画是图片以撕碎的特效进行切换,相当震撼。另外,在图片切换过程中,你也可以通过鼠标拖动来查看切换时的具体细节效果。如果将它制作成一个效果非常独特而华丽的相册或者焦点图插件...

阅读(2394)赞 (17)

WEB前端

HTML5 3D 神秘游戏场景动画

1

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

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

阅读(1034)赞 (2)

WEB前端

基于Three.js的碰撞检测穿马路动画

1

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

Three.js是JavaScript编写的WebGL第三方库,提供了非常多的3D显示功能。今天要给大家分享的就是一款基于Three.js的穿马路游戏动画,主要使用了Three.js的碰撞检测功能,马路上穿梭着很多车辆,你可以通过方向键控制小方块的行进方向,顺利通过马路,如果方块...

阅读(2121)赞 (4)

WEB前端

基于Three.js和HTML5 Canvas的3D水晶球体

1

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

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

阅读(2692)赞 (3)