svg+TweenMax实现小熊猫吃面动画效果代码-html代码-BFW代码库

svg+TweenMax实现小熊猫吃面动画效果代码

代码语言：html

所属分类：动画

代码描述：svg+TweenMax实现小熊猫吃面动画效果代码

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

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

<head>
    <meta charset="UTF-8">

</head>

<body>
    <!-- partial:index.partial.html -->
    <svg class="panda" viewBox="0 0 1004 727">
  <g id="munchie">
    <path fill="#ebf2de" d="M0 0h1003.66v726.084H0z"/>
    <g id="panda">
      <path id="chopstick-2" d="M394.845 255.723l22.873 47.19" fill="none" stroke="#393439" stroke-width="4"/>
      <path id="chopstick-1" d="M414.264 259.129l3.454 43.784" fill="none" stroke="#393439" stroke-width="4"/>
      <ellipse cx="455.499" cy="417.078" rx="113.746" ry="20.827" fill="#c8cfbe"/>
      <use id="left-hand" xlink:href="#_Image1" x="398.881" y="295.518" width="67.812" height="86.508" transform="matrix(.99723 0 0 .99434 0 0)"/>
      <ellipse cx="511.837" cy="370.176" rx="80.156" ry="64.421" fill="#fff" stroke="#393439" stroke-width="3" stroke-linecap="round"/>
      <g id="head">
        <g class="move ear" id="left-ear">
          <ellipse cx="465.414" cy="223.312" rx="15.257" ry="14.952" fill="#585858" stroke="#393439" stroke-width="3" stroke-linecap="round"/>
          <path d="M463.847 213.207c7.134-1.471 15.246 2.131 16.824 13.503 1.074 7.743-6.548 16.103-14.111 14.173-7.568-1.932-13.718-9.801-14.111-14.173-.699-7.788 3.759-11.928 11.398-13.503z" fill="#444248"/>
          <path d="M466.45 217.469c6.812-1.358 14.558 1.967 16.064 12.463 1.026 7.145-6.252 14.861-13.473 13.08-7.227-1.783-13.099-9.046-13.474-13.08-.667-7.188 3.59-11.009 10.883-12.463z" fill="#393439"/>
        </g>
        <g class="move ear" id="right-ear">
          <ellipse cx="563.66" cy="223.312" rx="15.257" ry="14.952" fil.........完整代码请登录后点击上方下载按钮下载查看