title: Moving Divs using Css or Jquery
body: <p>I have a css div that I would like to MOVE. Css transitions and Jquery slide up and down expand or decrease the element size. Jquery animate left and right is the best I have found so far. However i would also like to move up and down. Can you do that with Jquery animate? If so how. If not is there a way to do this using Javascript Jquery or Css</p>
  
  <p>This is my code.</p>
  
  <pre><code>&lt;!DOCTYPE html&gt;
  &lt;html&gt;
      &lt;head&gt;
          &lt;style&gt;
              .purplecircle {
                  width: 50px;
                  height: 50px;
                  -webkit-border-radius: 50px;
                  -moz-border-radius: 50px;
                  border-radius: 50px;
                  background:#C0F;
                  position:absolute;
              }
          &lt;/style&gt;
          &lt;script src="jquery-1.11.3.min.js"&gt;&lt;/script&gt;
          &lt;script&gt;
              $(document).ready(function(){
                  $("#purplecircle1").animate({left: '96%'});
              });
          &lt;/script&gt;
      &lt;/head&gt;
      &lt;body&gt;
          &lt;center&gt;
              &lt;div class="purplecircle" id="purplecircle1"&gt;&lt;/div&gt;
          &lt;/center&gt;
      &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>