TweenMax+DrawSVGPlugin+svg实现可爱熊猫睡觉打呼噜动画效果代码-html代码-BFW代码库

TweenMax+DrawSVGPlugin+svg实现可爱熊猫睡觉打呼噜动画效果代码

代码语言：html

所属分类：动画

代码描述：TweenMax+DrawSVGPlugin+svg实现可爱熊猫睡觉打呼噜动画效果代码

代码标签： TweenMax DrawSVGPlugin svg 可爱熊猫睡觉呼噜动画

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

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

<head>
    <meta charset="UTF-8">
    <style>
        html, body {
      height: 100%;
    }
    
    body {
      display: flex;
      align-items: center;
      justify-content: center;
      width: 100%;
      margin: 0;
      padding: 0;
      overflow: hidden;
      background: #66D3CD;
    }
    
    svg {
      width: 100%;
      visibility: hidden;
    }
    </style>

</head>

<body>
    <!-- partial:index.partial.html -->
    <svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 800 600" xml:space="preserve">
  <filter id="shadowBlur" x="0%" y="0%" width="275%" height="150%">
    <feGaussianBlur in="SourceGraphic" stdDeviation="2"/>
  </filter>    
  <g id="shadow" opacity="0.4" filter="url(#shadowBlur)">
    <ellipse fill="#54AEA7" cx="394.676" cy="343.597" rx="65" ry="8"/>
  </g>
  <g id="body">
    <path id="frontPawR" fill="#303030" d="M369,338.5c0,3.59-6.716,6.5-15,6.5c-11,0-16-3.41-16-7s1-6,16-6C362.284,332,369,334.91,369,338.5z"/>
    <path fill="#FFFFFF" d="M417.562,346l13.759-0.251c7.796-1.072,14.679-6.179,14.679-14.11v0c0-13.608-11.473-24.64-25.625-24.64H394v16.344C394,335.857,394,346,417.562,346z"/>
    <path fill="#EBEBEB" d="M410.441,332.708c0,0,10.042,7.749,17.507,0.9.........完整代码请登录后点击上方下载按钮下载查看