zoukankan      html  css  js  c++  java
  • 小人行走的动画案例

      小人行走动画的案例:

      <!DOCTYPE html>
      <html>
        <head>
          <meta charset="UTF-8">
          <title></title>
          <style>
            *{
              margin:0;
              padding:0;
            }
            .div{
              200px;
              height:180px;
              position:absolute;
              top:100px;
              left:100px;
              background:url(01.png) no-repeat;                                        /* 背景图片自己找  */
              animation:name 1.8s steps(8) infinite;         /* steps(8)  意思是 播放速度 逐帧播放   在css animation中有介绍  */
            }
            @-webkit-keyframes name{
              from{background-position-x:0px;}
              to{background-position-x:-1600px;}
            }
          </style>
        </head>
        <body>
          <div class="div"></div>
        </body>
      </html>

      这是我找的图片   找类似这样的   此图是我在梦幻西游中找的 

      

  • 相关阅读:
    IssueQuery failed in redmine rake tasks
    rubymine 调试 redmine
    redmine rake tasks
    rails tutorial sample app
    win7 chm 打开失败记录
    rails再体验(第一个程序)
    Bitnami Redmine插件开发记录
    redmine export long csv file failed: 502 proxy error
    Java时区切换时的需要注意
    Android No static field XXX of type I in class Lcom/XXX/R$id错
  • 原文地址:https://www.cnblogs.com/shangjun6/p/10703954.html
Copyright © 2011-2022 走看看