three打造多彩磷光波动动画效果
代码语言:html
所属分类:动画
代码描述:three打造多彩磷光波动动画效果
下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <style> *{ padding: 0; margin: 0; } </style> </head> <body> <div id="container"></div> <script type="text/javascript" src="http://repo.bfw.wiki/bfwrepo/js/three.js"></script> <script id="vertexShader" type="x-shader/x-vertex"> void main() { gl_Position = vec4( position, 1.0 ); } </script> <script id="fragmentShader" type="x-shader/x-fragment"> #ifdef GL_ES precision mediump float; #endif #extension GL_OES_standard_derivatives : enable uniform float time; uniform vec2 mouse; uniform vec2 resolution; float noise(vec2 p) { p=(p); return fract(sin(p.x*45.11+p.y*97.23)*878.73+733.17)*2.0-1.0; } //参考: http://glslsandbox.com/e#65924.0 void main( void ){ vec2 uv = (gl_FragCoord.xy * 2.0 - resolution.xy) / min(resolution.x, resolution.y); vec2 fMosaicScal = vec2(2.0,20.0); vec2 vScreenSize = vec2(resolution.x,resolution.y); vec4 o = gl_FragColor; vec3 u = normalize(vec3(2.0*gl_FragCoord.xy-resolution.xy,resolution.xy.x))*1.2; u.x = floor(u.x * vScreenSize.x / fMosaicScal.x) / (vScreenSize.x / fMosaicScal.x); u.y = floor(u.y * vScreenSize.y / fMosaicScal.y) / (vScreenSize.y / fMosaicScal.y); u.z = floor(u.z * vScreenSize.y / fMosaicScal.y) / (vScreenSize.y / fMosaicScal.y); for(float i=0.;i<4.;i++){ u.y+=abs(.........完整代码请登录后点击上方下载按钮下载查看
网友评论0