title: animate div to move from bottom to right corner
body: <p>I have this,in this the image moves from bottom to left corner,but i want it to move from bottom to right corner.I have used transform translate property.</p>
  
  <p>here is the code</p>
  
  <p>html:</p>
  
  <pre><code>  &lt;div class="rocket"&gt;
          &lt;img src="images/rocket.png" alt=""/&gt;
      &lt;/div&gt;
  </code></pre>
  
  <p>css:</p>
  
  <pre><code>  .rocket{position:absolute;top:22%;left:18%; -webkit-animation: shimmy 3s infinite;animation: shimmy 3s infinite;  -webkit-animation-direction: alternate;animation-direction: alternate;width: 79px;height: 85px;}
     @keyframes shimmy {
      0% {
  transform: translate(0, 0);    
   }
    50% {
      transform: translate(12px, 12px);
     }
    100% {
      transform: translate(15px, 15px);
    }
   }
      @-webkit-keyframes shimmy {
   0% {
       -webkit-transform: translate(0, 0);    
      }
        50% {
        -webkit-transform: translate(12px, 12px);
        }
       100% {
        -webkit-transform: translate(15px, 15px);
       }
     }
  </code></pre>