three实现照片粒子化交互动画效果代码-html代码-BFW代码库

three实现照片粒子化交互动画效果代码

代码语言：html

所属分类：粒子

代码描述：three实现照片粒子化交互动画效果代码

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

<!DOCTYPE html>
<html lang="en" >
<head>
  <meta charset="UTF-8">

<style>
    body{
  margin: 0;
  cursor: none;
  overflow: hidden;
}

canvas{
  width: 100%;
  height: 100vh;
  display: block;
}

.content{
  overflow: hidden;
}

.cursor{
  position: absolute;
  top: 0;
  left: 0;
  z-index: 100;
  width: 50px;
  height: 50px;
  border-radius: 50%;
  pointer-events: none;
  border: 1px solid rgba(255,255,255, 0.7);
}
</style>
</head>
<body>
<!-- partial:index.partial.html -->
<div class="content">
  <div id="content-canvas"></div>
  <div class="cursor">
    <div class="pointer"></div>
  </div>
</div>  
<script id="vertexShader" type="f">
     #define TAU 6.28318530718
  
      precision highp float;

      attribute float pindex;
      attribute vec3 position;
      attribute vec3 offset;
      attribute vec2 uv;
      attribute float angle;

      uniform mat4 modelViewMatrix;
      uniform mat4 projectionMatrix;

      uniform float uTime;
      uniform float uRandom;
      uniform float uDepth;
      uniform float uSize;
      uniform vec3 uMouse;
      uniform vec2 uTextureSize;
      uniform sampler2D uTexture;
      uniform sampler2D uTouch;

      varying vec2 vPUv;
      varying vec2 vUv;

      // Description : Array and textureless GLSL 2D simplex noise function.
      //      Author : Ian McEwan, Ashima Arts.
      //  Maintainer : ijm
      //     Lastmod : 20110822 (ijm)
      //     License : Copyright (C) 2011 Ashima Arts. All rights reserved.
      //               Distributed under the MIT License. See LICENSE file.
      .........完整代码请登录后点击上方下载按钮下载查看