TweenMax+MorphSVGPlugin+svg实现一个冒泡泡和泡沫的啤酒瓶动画效果代码

代码语言:html

所属分类:动画

代码描述:TweenMax+MorphSVGPlugin+svg实现一个冒泡泡和泡沫的啤酒瓶动画效果代码GPlugin+svg实现一个冒泡泡和泡沫的啤酒瓶动画效果代码

代码标签: TweenMax MorphSVGPlugin svg 冒泡 泡沫 啤酒瓶 动画

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

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

<head>

  <meta charset="UTF-8">
  

  
<style>
body {
  text-align: center;
  font-family: sans-serif;
}

svg {
  max-width: 400px;
}

a {
  text-decoration: none;
  color: DodgerBlue;
}

.info {
  margin-top: 20px;
}
</style>



</head>

<body >
  <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 800 800">
  <g style="isolation:isolate">
    <path id="Background" fill="#fff" d="M0 0h800v800H0z"/>
    <g id="Objects">
      <circle id="bg" cx="400" cy="400" r="400" fill="#daa74e"/>
      <path id="shadow" d="M800 401.64L506.36 108 263.55 350.83l83.58 83.58-36.91 36.91 114.6 114.6L277 733.78l61.51 61.51A402.47 402.47 0 0 0 400 800c220.36 0 399.09-178.2 400-398.36z" opacity=".1" style="mix-blend-mode:multiply"/>
      <path id="glass-stand" fill="#f0f2f5" d="M497.7 729.88v-17.16h-47.93a477 477 0 0 0-63.24-3.91 477.06 477.06 0 0 0-63.23 3.91h-47.06c-.31.59-.63 1.16-1 1.71v16.9h.05c1.13 12 50.48 21.69 111.23 21.69 61.48 0 111.3-9..........完整代码请登录后点击上方下载按钮下载查看

网友评论0