three实现带反射折射大理石三维材质立方体动画效果代码
代码语言:html
所属分类:三维
代码描述:three实现带反射折射大理石三维材质立方体动画效果代码
代码标签: three 反射 折射 大理石 三维 材质 立方体
下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开
<!DOCTYPE html> <html lang="en" > <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1"> <script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/tweakpane.3.02.js"></script> <style> body { margin: 0; } canvas { z-index: -1; top: 0; display: block; width: 100%; height: 100%; position: fixed; } .footer { right: 2rem; bottom: 2rem; position: absolute; } .footer img { width: 2.5rem; transition: opacity 0.5s; } .footer img:hover { opacity: 0.5; } </style> </head> <body > <canvas></canvas> <script type="module"> import * as THREE from "https://cdn.skypack.dev/three@0.140.0/build/three.module"; import { OrbitControls } from "https://threejsfundamentals.org/threejs/resources/threejs/r132/examples/jsm/controls/OrbitControls.js"; import { RoundedBoxGeometry } from "https://threejsfundamentals.org/threejs/resources/threejs/r132/examples/jsm/geometries/RoundedBoxGeometry.js"; import { Reflector } from "https://threejsfundam.........完整代码请登录后点击上方下载按钮下载查看
网友评论0