pixi实现水面波纹涟漪动画效果代码-html代码-BFW代码库

pixi实现水面波纹涟漪动画效果代码

代码语言：html

所属分类：动画

代码描述：pixi实现水面波纹涟漪动画效果代码

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

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

<head>

  <meta charset="UTF-8">

  
  
  
<style>
* {
  padding: 0;
  margin: 0;
}

canvas {
  width: 100%;
  height: 100%;
  display: block;
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  object-fit: cover;
}
</style>

  
  



</head>

<body >
  

<script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/pixi.6.1.0.js"></script>
<script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/pixi-filters.min.js"></script>
      <script >
const Application = PIXI.Application;
const app = new Application({
  width: 1920,
  height: 1080 });

document.body.appendChild(app.view);

const loader = PIXI.Loader.shared;
loader.add("backgroundImage", "//repo.bfw.wiki/bfwrepo/image/6111ccb4bac88.png").load(setup);

function setup(loader, resources) {
  const backgroundImage = PIXI.Sprite.from(resources.backgroundImage.texture);
  backgroundImage.anchor.set(0.5);
  backgroundImage.x = app.renderer.width / 2;
  backgroundImage.y = app.renderer.height / 2;

  const container = new PIXI.Container();
  container.addChild(back.........完整代码请登录后点击上方下载按钮下载查看