threejs视频纹理VideoTextureColor让照片波动涟漪三维效果代码

代码语言:html

所属分类:三维

代码描述:threejs视频纹理VideoTextureColor让照片波动涟漪三维效果代码

代码标签: three 视频纹理 VideoTexture 照片 波动 涟漪

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

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

<head>

  <meta charset="UTF-8">
  


  
  
<style>
.webgl {
  position: fixed;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  overflow: hidden;
}

.sample__video {
  z-index: 10;
  position: fixed;
  right: 0;
  top: 0;
  width: 32vw;
  height: 18vw;
}

.sample__title {
  z-index: 100;
  position: fixed;
  right: 1vw;
  top: 1vw;
  color: #f00;
  font-size: 10px;
}
</style>



</head>

<body  >
  <div class="webgl" id="js-webgl">
	<canvas class="webgl__canvas" id="js-webgl__canvas"></canvas>
</div>

<p class="sample__title">mp4</p>

<!-- vertexShader -->
<script id="js-vertex-shader" type="x-shader/x-vertex">
	uniform mat4 modelViewMatrix;
	uniform mat4 projectionMatrix;
	attribute vec3 position;
	attribute vec2 uv;
	varying vec2 vU.........完整代码请登录后点击上方下载按钮下载查看

网友评论0