卡通像素小猫咪跳跃动画特效代码js+html5-精品资源网

给大家分享一款卡通像素小猫咪跳跃动画特效代码js+html5，非常漂亮的一款代码，喜欢的朋友下载试试哦！

下载压缩包，里面有CSS和JS文件，代码亲测无错，直接拿走！

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

<link rel="stylesheet" href="static/css/style.css">

</head>
<body>

<div class="outer_wrapper">
    <div class="wrapper">

      <div class="cat_wrapper">
        <div class="cat first_pose">
          <div class="cat_head">
            <svg x="0px" y="0px" width="100%" height="100%" viewbox="0 0 76.4 61.2">
              <polygon class="eyes" points="63.8,54.1 50.7,54.1 50.7,59.6 27.1,59.6 27.1,54.1 12.4,54.1 12.4,31.8 63.8,31.8 "></polygon>
              <path d="M15.3,45.9h5.1V35.7h-5.1C15.3,35.7,15.3,45.9,15.3,45.9z M45.8,56.1V51H30.6v5.1H45.8z M61.1,35.7H56v10.2h5.1
                V35.7z M10.2,61.2v-5.1H5.1V51H0V25.5h5.1V15.3h5.1V5.1h5.1V0h5.1v5.1h5.1v5.1h5.1v5.1c0,0,15.2,0,15.2,0v-5.1h5.1V5.1H56V0h5.1v5.1
                h5.1v10.2h5.1v10.2h5.1l0,25.5h-5.1v5.1h-5.1v5.1H10.2z"></path>
            </svg>

          </div>
          <div class="body">
            <svg x="0px" y="0px" width="100%" height="100%" viewbox="0 0 91.7 40.8">
              <path class="st0" d="M91.7,40.8H0V10.2h5.1V5.1h5.1V0h66.2v5.1h10.2v5.1h5.1L91.7,40.8z"></path>
            </svg>

            <div class="tail">
              <svg x="0px" y="0px" width="100%" height="100%" viewbox="0 0 25.5 61.1">
                <polygon class="st0" points="10.2,56 10.2,50.9 5.1,50.9 5.1,40.7 0,40.7 0,20.4 5.1,20.4 5.1,10.2 10.2,10.2 10.2,5.1 15.3,5.1 
                  15.3,0 25.5,0 25.5,10.2 20.4,10.2 20.4,15.3 15.3,15.3 15.3,20.4 10.2,20.4 10.2,40.7 15.3,40.7 15.3,45.8 20.4,45.8 20.4,50.9 
                  25.5,50.9 25.5,61.1 15.3,61.1 15.3,56 "></polygon>
              </svg>
            </div>
          </div>
          
          <div class="front_legs">
            <div class="leg one">
              <svg x="0px" y="0px" width="100%" height="100%" viewbox="0 0 14 30.5">
                <polygon points="15.3,30.5 5.1,30.5 5.1,25.4 0,25.4 0,0 15.3,0 "></polygon>
              </svg>
            </div>
            <div class="leg two">
              <svg x="0px" y="0px" width="100%" height="100%" viewbox="0 0 14 30.5">
                <polygon points="15.3,30.5 5.1,30.5 5.1,25.4 0,25.4 0,0 15.3,0 "></polygon>
              </svg>
            </div>  
          </div>
          
          <div class="back_legs">
            <div class="leg three">
              <svg x="0px" y="0px" width="100%" height="100%" viewbox="0 0 14 30.5">
                <polygon points="15.3,30.5 5.1,30.5 5.1,25.4 0,25.4 0,0 15.3,0 "></polygon>
              </svg>
            </div>
            <div class="leg four">
              <svg x="0px" y="0px" width="100%" height="100%" viewbox="0 0 14 30.5">
                <polygon points="15.3,30.5 5.1,30.5 5.1,25.4 0,25.4 0,0 15.3,0 "></polygon>
              </svg>
            </div>
          </div>
        </div>
      </div>
    </div>
    
    <div class="ground"></div>

  </div>

    
  <div class="sign">
     / <a href="javascript:;"></a>
  </div>

<script src="static/js/script.js"></script>

</body>
</html>

卡通像素猫跳跃互动动画特效代码下载

声明 1 本站名称：精品资源网
2 本站永久网址：https://www.jpzyw.net
3 本站部分资源来自于网络，分享给大家学习参考，如有侵权，请及时联系站长进行删除处理。
4 本站不对所有资源其观点和其真实性负责。
5 本站一律禁止用户以任何方式发布或转载违背法律法规的相关信息，访客发现请及时向站长举报。

THE END