three+hammer实现三维蜜蜂飞行金币游戏代码-html代码-BFW代码库

three+hammer实现三维蜜蜂飞行金币游戏代码

代码语言：html

所属分类：游戏

代码描述：three+hammer实现三维蜜蜂飞行金币游戏代码，拖动鼠标来操控蜜蜂飞行获取更多的金币。

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

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

<head>

  <meta charset="UTF-8">
  

  
  
  
<style>
@import url("https://fonts.googleapis.com/css?family=Kanit:800|Mr+Dafoe");
html {
  box-sizing: border-box;
  color: #222;
  font-size: 1.6rem;
  font-family: Helvetica, Arial, sans-serif;
  font-weight: normal;
  line-height: 1.5;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

*, *:before, *:after {
  box-sizing: inherit;
}

* {
  margin: 0;
  padding: 0;
  overflow: hidden "";
}

#world {
  position: absolute;
  width: 100%;
  height: 100%;
  overflow: hidden;
  background: linear-gradient(to bottom, #94c5f8 0%, #a6e6ff 10%, #b1b5ea 20%, #fa709a 30%, #fee140 40%, #FF1361 50%, #44107A 60%, #231557 70%, #0250c5 80%, #d43f8d 100%);
  background-repeat: repeat-y;
  background-size: 100% 1000%;
  background-position: 0 0;
  transition: background 6000ms ease-in-out;
}
#world.yellow {
  background-position: 0 20%;
}
#world.red {
  background-position: 0 40%;
}
#world.black {
  background-position: 0 60%;
}
#world.blue {
  background-position: 0 80%;
}

.txt {
  position: absolute;
  color: #a96fa0;
  font-family: sans-serif;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  height: 100%;
}
.txt .header {
  text-align: center;
}
.txt .header-sub {
  opacity: 0.4;
}
.txt .title, .txt h1 {
  color: #5fd1b4;
  font-family: "Kanit", Helvetica, Arial, sans-serif;
  font-weight: 800;
  letter-spacing: -0.04em;
  line-height: 0.7;
  text-transform: uppercase;
  position: relative;
  margin: 0.2em;
  font-size: 2.5rem;
  text-shadow: 0.02em 0.02em 0.02em rgba(0, 0, 0, 0.08);
  filter: drop-shadow(0.045em 0.045em 0.04em rgba(0, 0, 0, 0.21));
}
.txt .title-sub {
  color: #fff;
  font: 200 0.45em/1 "Mr Dafoe", serif;
  text-transform: none;
  letter-spacing: 0.02em;
  text-shadow: 0.02em 0.02em 0.02em rgba(0, 0, 0, 0.3);
  position: absolute;
  top: 50%;
  left: 50%;
  font-size: 1rem;
  transform: translate(-50%, -50%) rotate(-5deg);
}
.txt .subhead {
  color: inherit;
  font-weight: bold;
  letter-spacing: 0.4em;
  text-transform: uppercase;
  font-size: 0.3rem;
}
.txt h1 {
  font-size: 1rem;
}
</style>




</head>


  <body id="js-touch">
    <div id="world"></div>
    <div class="txt">
      <header class="header">
        <h1 class="title">
          Wizbii
          <div class="title-sub"></div>
        </h1>
        <div class="header-sub subhead"></div>
      </header>
      <h1>Score : <span id="js-score"></span></h1>
    </div>


<script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/three.92.js"></script>
<script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/hammer.min.js"></script>
      <script >
const colors = {
  green: 0x2bca2b,
  black: 0x333359,
  white: 0xd8d0d1,
  pink: 0xf5986e,
  blue: 0x68c3c0,
  grey: 0x5f5f5f,
  yellow: 0xe7af1.........完整代码请登录后点击上方下载按钮下载查看