three实现三维图片飘动漂浮动画效果代码-html代码-BFW代码库

代码语言：html

所属分类：三维

代码描述：three实现三维图片飘动漂浮动画效果代码

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

<!DOCTYPE html>
<html lang="en" >
<head>
  <meta charset="UTF-8">

<style>
    @charset "UTF-8";
* {
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
}

.p-text {
  color: #fffffd;
  font-family: Helvetica, Arial, sans-serif;
  line-height: 1.5;
  text-align: center;
  text-transform: lowercase;
}

.p-flex-hzt-center {
  display: flex;
  justify-content: center;
}

body {
  height: 100vh;
  background-color: hotpink;
  margin: 0;
  padding: 0;
  overflow: hidden;
}

.bg {
  width: 100%;
  height: 100%;
  /*Free Sprinkles SVG background provided by SVGeez.com - CC 4.0 License - © 2019 Megan Young */
  fill: #7c4de1;
  background-size: 131px 131px;
  background-repeat: repeat;
  background-image: url("data:image/svg+xml,%3Csvg id='Layer_1' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 500 500' fill-opacity='1' %3E%3Cstyle%3E .st0{fill:rgb(124, 77, 225)} %3C/style%3E%3Cpath class='st0' d='M55.5 475h-19c-1.9 0-3.5-1.6-3.5-3.5s1.6-3.5 3.5-3.5h19c1.9 0 3.5 1.6 3.5 3.5s-1.6 3.5-3.5 3.5zM144.7 178.9c-.4 0-.8-.1-1.2-.2-1.8-.7-2.7-2.7-2.1-4.5l6.6-17.8c.7-1.8 2.7-2.7 4.5-2.1 1.8.7 2.7 2.7 2.1 4.5l-6.6 17.8c-.6 1.4-1.9 2.3-3.3 2.3zM107.9 130.4c-1 0-2.1-.5-2.7-1.3l-11.8-14.9c-1.2-1.5-.9-3.7.6-4.9 1.5-1.2 3.7-.9 4.9.6l11.8 14.9c1.2 1.5.9 3.7-.6 4.9-.7.5-1.4.7-2.2.7zM103.2 87.6c-1.5 0-2.8-.9-3.3-2.4-.6-1.8.3-3.8 2.2-4.4l6.6-2.3c1.8-.6 3.8.3 4.4 2.2.6 1.8-.3 3.8-2.2 4.4l-6.6 2.3c-.3.2-.7.2-1.1.2zM300.5 46c-.9 0-1.8-.3-2.5-1-1.4-1.4-1.4-3.6 0-5l15-15c1.4-1.4 3.6-1.4 4.9 0 1.4 1.4 1.4 3.6 0 5l-15 15c-.6.7-1.5 1-2.4 1zM193.5 292c-1.9 0-3.5-1.6-3.5-3.5v-9c0-1.9 1.6-3.5 3.5-3.5s3.5 1.6 3.5 3.5v9c0 1.9-1.6 3.5-3.5 3.5zM163.5 40c-.9 0-1.8-.3-2.5-1-1.4-1.4-1.4-3.6 0-5l17.5-17.5c1.4-1.4 3.6-1.4 5 0s1.4 3.6 0 5L166 39c-.7.7-1.6 1-2.5 1zM252.5 167h-12c-1.9 0-3.5-1.6-3.5-3.5s1.6-3.5 3.5-3.5h12c1.9 0 3.5 1.6 3.5 3.5s-1.6 3.5-3.5 3.5zM199 142.5c-.9 0-1.8-.3-2.5-1L186 131c-1.4-1.4-1.4-3.6 0-5s3.6-1.4 5 0l10.5 10.5c1.4 1.4 1.4 3.6 0 5-.7.7-1.6 1-2.5 1zM108.5 162h-31c-1.9 0-3.5-1.6-3.5-3.5s1.6-3.5 3.5-3.5h31c1.9 0 3.5 1.6 3.5 3.5s-1.6 3.5-3.5 3.5zM134.5 231c-1.9 0-3.5-1.6-3.5-3.5v-16c0-1.9 1.6-3.5 3.5-3.5s3.5 1.6 3.5 3.5v16c0 1.9-1.6 3.5-3.5 3.5zM136.5 86c-1.9 0-3.5-1.6-3.5-3.5v-23c0-1.9 1.6-3.5 3.5-3.5s3.5 1.6 3.5 3.5v23c0 1.9-1.6 3.5-3.5 3.5zM63.5 64h-21c-1.9 0-3.5-1.6-3.5-3.5s1.6-3.5 3.5-3.5h21c1.9 0 3.5 1.6 3.5 3.5S65.4 64 63.5 64zM70.5 124c-.9 0-1.8-.3-2.5-1l-9-9c-1.4-1.4-1.4-3.6 0-5s3.6-1.4 5 0l9 9c1.4 1.4 1.4 3.6 0 5-.7.7-1.6 1-2.5 1zM97.5 200c-1.9 0-3.5-1.6-3.5-3.5v-8c0-1.9 1.6-3.5 3.5-3.5s3.5 1.6 3.5 3.5v8c0 1.9-1.6 3.5-3.5 3.5zM256.5 129h-15c-1.9 0-3.5-1.6-3.5-3.5s1.6-3.5 3.5-3.5h15c1.9 0 3.5 1.6 3.5 3.5s-1.6 3.5-3.5 3.5zM172.5 102c-1.9 0-3.5-1.6-3.5-3.5v-9c0-1.9 1.6-3.5 3.5-3.5s3.5 1.6 3.5 3.5v9c0 1.9-1.6 3.5-3.5 3.5zM275.5 214c-.9 0-1.8-.3-2.5-1l-9-9c-1.4-1.4-1.4-3.6 0-5s3.6-1.4 4.9 0l9 9c1.4 1.4 1.4 3.6 0 5-.6.7-1.5 1-2.4 1zM104.5 262c-1.9 0-3.5-1.6-3.5-3.5v-17c0-1.9 1.6-3.5 3.5-3.5s3.5 1.6 3.5 3.5v17c0 1.9-1.6 3.5-3.5 3.5zM53.5 278c-1.1 0-2.1-.5-2.8-1.4-1.2-1.5-.8-3.7.7-4.9l12-9c1.5-1.2 3.7-.8 4.9.7 1.2 1.5.8 3.7-.7 4.9l-12 9c-.6.5-1.4.7-2.1.7zM173.5 264c-.6 0-1.1-.1-1.7-.4l-13-7c-1.7-.9-2.3-3-1.4-4.7.9-1.7 3-2.3 4.7-1.4l13 7c1.7.9 2.3 3 1.4 4.7-.6 1.1-1.8 1.8-3 1.8zM203.5 182h-26c-1.9 0-3.5-1.6-3.5-3.5s1.6-3.5 3.5-3.5h26c1.9 0 3.5 1.6 3.5 3.5s-1.6 3.5-3.5 3.5zM84.5 61c-1.9 0-3.5-1.6-3.5-3.5v-22c0-1.9 1.6-3.5 3.5-3.5s3.5 1.6 3.5 3.5v22c0 1.9-1.6 3.5-3.5 3.5zM196.5 82c-.9 0-1.8-.3-2.5-1-1.4-1.4-1.4-3.6 0-5l15-15c1.4-1.4 3.6-1.4 5 0s1.4 3.6 0 5l-15 15c-.7.7-1.6 1-2.5 1zM196.5 236c-.9 0-1.8-.3-2.5-1l-13-13c-1.4-1.4-1.4-3.6 0-5s3.6-1.4 5 0l13 13c1.4 1.4 1.4 3.6 0 5-.7.7-1.6 1-2.5 1zM37.5 151c-1.1 0-2.2-.5-2.9-1.6-1.1-1.6-.6-3.8 1-4.9l9-6c1.6-1.1 3.8-.6 4.9 1 1.1 1.6.6 3.8-1 4.9l-9 6c-.7.4-1.3.6-2 .6zM30.5 107h-5c-1.9 0-3.5-1.6-3.5-3.5s1.6-3.5 3.5-3.5h5c1.9 0 3.5 1.6 3.5 3.5s-1.6 3.5-3.5 3.5zM121.5 42h-6c-1.9 0-3.5-1.6-3.5-3.5s1.6-3.5 3.5-3.5h6c1.9 0 3.5 1.6 3.5 3.5s-1.6 3.5-3.5 3.5zM123.5 345c-1.2 0-2.3-.6-3-1.6l-7-11c-1-1.6-.6-3.8 1.1-4.8 1.6-1 3.8-.6 4.8 1.1l7 11c1 1.6.6 3.8-1.1 4.8-.5.3-1.2.5-1.8.5zM31.5 353c-.2 0-.5 0-.7-.1-1.9-.4-3.1-2.3-2.7-4.2l3-14c.4-1.9 2.3-3.1 4.2-2.7 1.9.4 3.1 2.3 2.7 4.2l-3 14c-.4 1.7-1.9 2.8-3.5 2.8zM72.5 318c-.6 0-1.1-.1-1.6-.4l-17-9c-1.7-.9-2.4-3-1.5-4.7.9-1.7 3-2.4 4.7-1.5l17 9c1.7.9 2.4 3 1.5 4.7-.6 1.2-1.8 1.9-3.1 1.9zM256.5 380h-19c-1.9 0-3.5-1.6-3.5-3.5s1.6-3.5 3.5-3.5h19c1.9 0 3.5 1.6 3.5 3.5s-1.6 3.5-3.5 3.5zM299.2 353.3c-.2 0-.4 0-.7-.1-1.9-.4-3.1-2.2-2.8-4.1l3.6-18.7c.4-1.9 2.2-3.1 4.1-2.8 1.9.4 3.1 2.2 2.8 4.1l-3.6 18.7c-.3 1.8-1.7 2.9-3.4 2.9zM328 295c-.4 0-.7-.1-1.1-.2l-18-5.9c-1.8-.6-2.8-2.6-2.2-4.4.6-1.8 2.6-2.8 4.4-2.2l18 5.9c1.8.6 2.8 2.6 2.2 4.4-.4 1.4-1.8 2.4-3.3 2.4zM345.2 267.6c-1.5 0-2.8-.9-3.3-2.4-.6-1.8.3-3.8 2.2-4.4l6.6-2.3c1.8-.6 3.8.3 4.4 2.2.6 1.8-.3 3.8-2.2 4.4l-6.6 2.3c-.4.2-.7.2-1.1.2zM396 381.5c-.9 0-1.8-.3-2.5-1L376 363c-1.4-1.4-1.4-3.6 0-4.9 1.4-1.4 3.6-1.4 4.9 0l17.5 17.5c1.4 1.4 1.4 3.6 0 4.9-.6.7-1.5 1-2.4 1zM350.5 422c-.9 0-1.8-.3-2.5-1-1.4-1.4-1.4-3.6 0-4.9l15-15c1.4-1.4 3.6-1.4 4.9 0 1.4 1.4 1.4 3.6 0 4.9l-15 15c-.6.7-1.5 1-2.4 1zM417.3 460.2c-1.4 0-2.7-.8-3.2-2.2-.7-1.8.1-3.8 1.9-4.6l8.3-3.4c1.8-.7 3.8.1 4.6 1.9.7 1.8-.1 3.8-1.9 4.6l-8.3 3.4c-.5.2-.9.3-1.4.3zM329.5 464c-.9 0-1.8-.3-2.5-1-1.4-1.4-1.4-3.6 0-4.9l17.5-17.5c1.4-1.4 3.6-1.4 4.9 0 1.4 1.4 1.4 3.6 0 4.9L332 463c-.7.7-1.6 1-2.5 1zM486.5 401h-12c-1.9 0-3.5-1.6-3.5-3.5s1.6-3.5 3.5-3.5h12c1.9 0 3.5 1.6 3.5 3.5s-1.6 3.5-3.5 3.5zM399 442.5c-.9 0-1.8-.3-2.5-1L386 431c-1.4-1.4-1.4-3.6 0-4.9 1.4-1.4 3.6-1.4 4.9 0l10.5 10.5c1.4 1.4 1.4 3.6 0 4.9-.6.7-1.5 1-2.4 1zM314.5 405h-31c-1.9 0-3.5-1.6-3.5-3.5s1.6-3.5 3.5-3.5h31c1.9 0 3.5 1.6 3.5 3.5s-1.6 3.5-3.5 3.5zM338.5 375c-1.9 0-3.5-1.6-3.5-3.5v-23c0-1.9 1.6-3.5 3.5-3.5s3.5 1.6 3.5 3.5v23c0 1.9-1.6 3.5-3.5 3.5zM454.5 382h-15c-1.9 0-3.5-1.6-3.5-3.5s1.6-3.5 3.5-3.5h15c1.9 0 3.5 1.6 3.5 3.5s-1.6 3.5-3.5 3.5zM426.5 414c-1.9 0-3.5-1.6-3.5-3.5v-9c0-1.9 1.6-3.5 3.5-3.5s3.5 1.6 3.5 3.5v9c0 1.9-1.6 3.5-3.5 3.5zM402.5 325c-.9 0-1.8-.3-2.5-1-1.4-1.4-1.4-3.6 0-4.9l15-15c1.4-1.4 3.6-1.4 4.9 0 1.4 1.4 1.4 3.6 0 4.9l-15 15c-.6.7-1.5 1-2.4 1zM423.5 257c-1.2 0-2.3-.6-3-1.6l-7-11c-1-1.6-.6-3.8 1.1-4.8 1.6-1 3.8-.6 4.8 1.1l7 11c1 1.6.6 3.8-1.1 4.8-.5.3-1.2.5-1.8.5zM413.5 198c-.6 0-1.1-.1-1.6-.4l-17-9c-1.7-.9-2.4-3-1.5-4.7.9-1.7 3-2.4 4.7-1.5l17 9c1.7.9 2.4 3 1.5 4.7-.6 1.2-1.8 1.9-3.1 1.9zM220.5 344c-1.6 0-3-1.1-3.4-2.7l-9-36c-.5-1.9.7-3.8 2.5-4.2 1.9-.5 3.8.7 4.2 2.5l9 36c.5 1.9-.7 3.8-2.5 4.2-.2.2-.5.2-.8.2zM276.5 281.5c-2.5 0-4.6-1.9-4.9-4.3l-3-22c-.2-1.3.2-2.6 1-3.7s2-1.7 3.3-1.9c1.3-.2 2.6.2 3.7 1s1.8 2 1.9 3.3l3 22c.2 1.3-.2 2.6-1 3.7s-2 1.7-3.3 1.9h-.7zm-3-29h-.3c-.5.1-1 .3-1.3.8-.3.4-.5 1-.4 1.5l3 22c.1 1.1 1.1 1.9 2.2 1.7.5-.1 1-.3 1.3-.8.3-.4.5-1 .4-1.5l-3-22c-.1-.5-.3-1-.8-1.3-.2-.3-.7-.4-1.1-.4zM139.5 297h-.3l-21-2c-1.9-.2-3.3-1.9-3.2-3.8.2-1.9 1.9-3.3 3.8-3.2l21 2c1.9.2 3.3 1.9 3.2 3.8-.2 1.8-1.7 3.2-3.5 3.2zM289.5 168c-.3 0-.6 0-1-.1l-7-2c-1.9-.5-2.9-2.5-2.4-4.3.5-1.9 2.5-2.9 4.3-2.4l7 2c1.9.5 2.9 2.5 2.4 4.3-.4 1.5-1.8 2.5-3.3 2.5zM89.5 400H89c-1.9-.3-3.2-2.1-2.9-4l4-26c.3-1.9 2.1-3.2 4-2.9 1.9.3 3.2 2.1 2.9 4l-4 26c-.3 1.7-1.8 2.9-3.5 2.9zM163.5 400c-.5 0-1-.1-1.5-.3-1.8-.8-2.5-2.9-1.7-4.7l7-15c.8-1.8 2.9-2.5 4.7-1.7 1.8.8 2.5 2.9 1.7 4.7l-7 15c-.6 1.3-1.9 2-3.2 2zM221.5 263c-1.7 0-3.2-1.2-3.5-3-.3-1.9 1-3.7 2.9-4l13-2c1.9-.3 3.7 1 4 2.9s-1 3.7-2.9 4l-13 2c-.1.1-.3.1-.5.1zM174.5 341c-.4 0-.7-.1-1.1-.2l-15-5c-1.8-.6-2.8-2.6-2.2-4.4.6-1.8 2.6-2.8 4.4-2.2l15 5c1.8.6 2.8 2.6 2.2 4.4-.5 1.5-1.8 2.4-3.3 2.4zM260.5 320c-1 0-1.9-.4-2.6-1.2-1.3-1.5-1.1-3.7.3-4.9l8-7c1.5-1.3 3.7-1.1 4.9.3 1.3 1.5 1.1 3.7-.3 4.9l-8 7c-.7.6-1.5.9-2.3.9zM217.5 384c-1 0-2.........完整代码请登录后点击上方下载按钮下载查看