title: Javascript - Div/Image Slide down from the top
body: <p>I've been trying to simply make a picture slide down from the top (outside of the div) to the position it's supposed to be. I've found some other people asking for something similar but so far nothing worked for me. What am I supposed to do to make it work? (Yes I'm just starting with using Javascript)
  I'm using JQuery and this is my Javascript code:</p>
  
  <pre><code>$(document).ready(function(){
  
  function slide(){
      $(".head").delay(100).animate({"top":"400px"},500);}
  });
  </code></pre>
  
  <p>It's supposed to make the picture in this div move.</p>
  
  <pre><code>&lt;div id="content"&gt;
      &lt;img src="img/contact_header.png" alt="headerContact" class="head" /&gt;&lt;br /&gt;
      &lt;p&gt; Text here &lt;/p&gt;
  &lt;/div&gt; 
  </code></pre>
  
  <p>The div and the class have the following CSS settings</p>
  
  <pre><code>#content {
      width: 800px;
      padding: 0 0 40px 0; 
      margin-left: 100px;
      margin-top: 160px;
      background-color: #FFF;
      float: left;
  }
  
  .head { top: -200px; }
  </code></pre>