three打造一个三维小鱼跟随鼠标游动效果代码-html代码-BFW代码库

three打造一个三维小鱼跟随鼠标游动效果代码

代码语言：html

所属分类：三维

代码描述：three打造一个三维小鱼跟随鼠标游动效果代码

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

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

<head>

  <meta charset="UTF-8">
  


  
  
<style>
@import url(https://fonts.googleapis.com/css?family=Open+Sans:800);

#world{
  background: linear-gradient(#8ee4ae, #e9eba3);
  position:absolute;
  width:100%;
  height:100%;
  overflow:hidden;
}
#instructions{
  position:absolute;
  width:100%;
  top:50%;
  margin: auto;
  margin-top:80px;
  font-family:'Open Sans', sans-serif;
  color:#71b583;
  font-size:1.2em;
  text-transform: uppercase;
  text-align : center;
}

#credits{
  position:absolute;
  width:100%;
  margin: auto;
  bottom:0;
  margin-bottom:20px;
  font-family:'Open Sans', sans-serif;
  color:#71b583;
  font-size:0.7em;
  text-transform: uppercase;
  text-align : center;
}
#credits a {
  color:#71b583;
}
</style>




</head>

<body >
  <div id="world"></div>
<div id="instructions">Move your mouse <br/>to change speed and direction</div>


 
<script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/stats-min.js"></script>
<script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/three.72.js"></script>

      <script>
//THREEJS RELATED VARIABLES 

var scene,
camera,
fieldOfView,
aspectRatio,
nearPlane,
farPlane,
shadowLight,
light,
renderer,
container;

//SCREEN VARIABLES 
var HEIGHT,
WIDTH,
windowHalfX,
windowHalfY,
xLimit,
yLimit;

// FISH BODY PARTS
var fish,
bodyFish,
tailFish,
topFish,
rightIris,
leftIris,
rightEye,
leftEye,
lipsFish,
tooth1,
tooth2,
tooth3,
tooth4,
tooth5;
.........完整代码请登录后点击上方下载按钮下载查看