glea实现canvas凹凸不平的粘液动画效果代码-html代码-BFW代码库

glea实现canvas凹凸不平的粘液动画效果代码

代码语言：html

所属分类：动画

代码描述：glea实现canvas凹凸不平的粘液动画效果代码

下面为部分代码预览，完整代码请点击下载或在bfwstudio webide中打开

<!DOCTYPE html>
<html lang="en" >

<head>
  <meta charset="UTF-8">
  


  
  
  
  
<style>
body {
  margin: 0;
}

canvas {
  display: block;
  width: 100vw;
  height: 100vh;
}
</style>

<script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/glea.js"></script>
  
  
</head>

<body translate="no">
  <canvas></canvas>
  
      <script type="module">


const glsl = x => x;

const frag = glsl`
precision highp float;
#define ITERS 64
#define PI 3.141592654
uniform float width;
uniform float height;
uniform float time;

// normalize coords and correct for aspect ratio
vec2 normalizeScreenCoords()
{
  float aspectRatio = width / height;
  vec2 result = 2.0 * (gl_FragCoord.xy / vec2(width, height) - 0.5);
  result.x *= aspectRatio; 
  return result;
}

// by IQ
// cosine based.........完整代码请登录后点击上方下载按钮下载查看