three+TweenMax实现三维城市夜晚粒子穿行文字背景动画交互效果代码-html代码-BFW代码库

three+TweenMax实现三维城市夜晚粒子穿行文字背景动画交互效果代码

代码语言：html

所属分类：三维

代码描述：three+TweenMax实现三维城市夜晚粒子穿行文字背景动画交互效果代码，

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

<!DOCTYPE html>
<html lang="en" >
<head>
  <meta charset="UTF-8">
  
  <meta name="viewport" content="width=device-width, initial-scale=1">
<link type="text/css" rel="stylesheet" href="//repo.bfw.wiki/bfwrepo/css/bootstrap.4.3.1.min.css">
<style>
    body {
  color: white;
  margin: 0;
  text-align: center;
  background-color: black;
  cursor: crosshair;
}
canvas {
  display: block;
  width: 100%;
  height: 100%;
}
p {
  color: rgba(255,255,255, 0.5)
}
.header {
  top: 42%;
}
.header-content {
  padding: 50px;
  background-color: rgba(0,0,0,0.3);
  border-radius: 10px;
}
.footer {
  bottom:3%;
}
.description {
  color: gray;
  padding-top: 50px;
}
a, a:hover, a:visited {
  color: white;
  text-decoration: none;
} 
.disable-selection {
     -moz-user-select: none; /* Firefox */
      -ms-user-select: none; /* Internet Explorer */
   -khtml-user-select: none; /* KHTML browsers (e.g. Konqueror) */
  -webkit-user-select: none; /* Chrome, Safari, and Opera */
  -webkit-touch-callout: none; /* Disable Android and iOS callouts*/
}
h1::after {
  content: ' Three JS';
  font-size: 12px;
  position:absolute;
  top: 3px;
  padding-left: 5px;
  font-weight: 400;
}
h2::after {
  content: '2';
  font-size: 12px;
  position:absolute;
  top: 14px;
  padding-left: 5px;
}

.btn {
  border-radius: 100px;
  padding: 10px 25px;
}
</style>
</head>
<body>
<!-- partial:index.partial.html -->
<div class="container-fluid fixed-top header disable-selection">
  <div class="row">
    <div class="col"></div>
    <div class="col-md-6">
      <div class="row">
        <div class="col">
          <h1><strong>Lab City 3D</strong></h1>
          <p class="small">– Back to the red –</p>
          <!--.btn.btn-danger(href='#',role=&#.........完整代码请登录后点击上方下载按钮下载查看