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: #ebe5e7;
  position:absolute;
  width:100%;
  height:100%;
  overflow:hidden;
}
#instructions{
  position:absolute;
  width:100%;
  top:50%;
  margin: auto;
  margin-top:120px;
  font-family:'Open Sans', sans-serif;
  color:#653f4c;
  font-size:.9em;
  text-transform: uppercase;
  text-align : center;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
}
.lightInstructions {
  color:#993f4c;
  font-size:.8em;
}

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

#credits .society6 {
  color:#993f4c;
}
</style>

</head>
<body translate="no">
<div id="world"></div>
<div id="instructions">Press and drag to make wind<br /><span class="lightInstructions">the lion will surely appreciate</span></div>


<script type="text/javascript" src="http://repo.bfw.wiki/bfwrepo/js/three.72.js"></script>

<script src='http://repo.bfw.wiki/bfwrepo/js/OrbitControls.js'></script>
<script>

//THREEJS RELATED VARIABLES 

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

//SCENE
var floor, lion, fan,
    isBlowing = false;

//SCREEN VARIABLES

var HEIGHT,
  	WIDTH,
    windowHalfX,
  	windowHalfY,
    mousePos = {x:0,y:0};
    dist = 0;

//INIT THREE JS, SCREEN AND MOUSE EVENTS

function init(){
  scene = new THREE.Scene();
  HEIGHT = window.innerHeight;
  WIDTH = window.innerWidth;
  aspectRatio = WIDTH / HEIGHT;
  fieldOfView = 60;
  nearPlane = 1;
  farPlane = 2000; 
  camera = new THREE.PerspectiveCamera(
    fieldOfView,
    aspectRatio,
    nearPlane,
    farPlane);
  ca.........完整代码请登录后点击上方下载按钮下载查看

网友评论0