gsap液体流动动画效果-html代码-BFW代码库

gsap液体流动动画效果

代码语言：html

所属分类：动画

代码描述：gsap液体流动动画效果

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

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

<title>CodePen - SPECIMEN</title>
<style>
body {
 background-color: #070616;
 overflow: hidden;
 text-align:center;
  display: flex;
  align-items: center;
  justify-content: center; 
}

body,
html {
 height: 100%;
 width: 100%;
 margin: 0;
 padding: 0;
}

svg {
 width: 100%;
 height: 100%;
 visibility: hidden;
 
}

use {
        -mix-blend-mode: overlay;
}
</style>

</head>
<body translate="no">
<svg id="mainSVG" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 800 600">
<defs>
<path id="gridBox" d="M281,328.39l30-109.16M518.73,328.89,281,328.39m30-109.16H489m0,0,29.74,109.66" fill="none" stroke-miterlimit="10" stroke-width="0.75" />
<filter id="glow" x="-100%" y="-100%" width="250%" height="250%">
<feGaussianBlur stdDeviation="20" result="coloredBlur" />
<feOffset dx="0" dy="0" result="offsetblur"></feOffset>
<feFlood id="glowAlpha" flood-color="#3F21E9" flood-opacity="1"></feFlood>
<feComposite in2="offsetblur" operator="in".........完整代码请登录后点击上方下载按钮下载查看