title: jQuery hover fadeIn fadeOut problem
body: <p>I just got back to html, javascript and jquery and i'm a bit rusty. I've mostly been doing objective-c for a while and getting back to jquery is a little difficult. I'm trying to use the jQuery fadeIn and fadeOut bit but its not working for some reason... Here's the html and js I've been working on :</p>
  
  <pre><code>&lt;script type="text/javascript" src="http://code.jquery.com/jquery-1.6.3.min.js"&gt;
  function showImg(2img) {
            $(2img).fadeIn('slow', function() {
          // Animation complete
        });
  }
  
  function hideImg(2img) {
            $(2img).fadeOut('slow', function() {
          // Animation complete
        });
  }
  &lt;/script&gt;
  &lt;body&gt;
  &lt;table width="1659" height="701" border="0" align="center"&gt;
    &lt;tr&gt;
  &lt;th width="325" scope="col"&gt;&lt;div style="position: relative; left: 0; top: 0;"&gt;&lt;img                         id="img1" src="" width="232" height="232" alt="" onmouseover="showimg(2img1)" onmouseout="hideimg(2img1)" style="position: relative; top: 0; left: 0;"/&gt;
  &lt;img id="2img1" src="" width="32" height="32" alt="" style="position: absolute; top: 100px; left: 150px; visibility:hidden;"/&gt;&lt;/div&gt;&lt;/th&gt;
  
  &lt;th width="325" scope="col"&gt;&lt;div style="position: relative; left: 0; top: 0;"&gt;&lt;img id="img2" src="" width="232" height="232" alt="" onmouseover="showimg(2img2)" onmouseout="hideimg(2img2)" style="position: relative; top: 0; left: 0;"/&gt;
  &lt;img id="2img2" src="" width="32" height="32" alt="" style="position: absolute; top: 100px; left: 150px; visibility:hidden;"/&gt;&lt;/div&gt;&lt;/th&gt;
  
  &lt;th width="325" scope="col"&gt;&lt;div style="position: relative; left: 0; top: 0;"&gt;&lt;img id="img3" src="" width="232" height="232" alt="" onmouseover="showimg(2img3)" onmouseout="hideimg(2img3)" style="position: relative; top: 0; left: 0;"/&gt;
  &lt;img id="2img3" src="" width="32" height="32" alt="" style="position: absolute; top: 100px; left: 150px; visibility:hidden;"/&gt;&lt;/div&gt;&lt;/th&gt;
  
  &lt;th width="325" scope="col"&gt;&lt;div style="position: relative; left: 0; top: 0;"&gt;&lt;img id="img4" src="" width="232" height="232" alt="" onmouseover="showimg(2img4)" onmouseout="hideimg(2img4)" style="position: relative; top: 0; left: 0;"/&gt;
  &lt;img id="2img4" src="" width="32" height="32" alt="" style="position: absolute; top: 100px; left: 150px; visibility:hidden;"/&gt;&lt;/div&gt;&lt;/th&gt;
  
  &lt;th width="325" scope="col"&gt;&lt;div style="position: relative; left: 0; top: 0;"&gt;&lt;img id="img5" src="" width="232" height="232" alt="" onmouseover="showimg(2img5)" onmouseout="hideimg(2img5)" style="position: relative; top: 0; left: 0;"/&gt;
  &lt;img id="2img5" src="" width="32" height="32" alt="" style="position: absolute; top: 100px; left: 150px; visibility:hidden;"/&gt;&lt;/div&gt;&lt;/th&gt;
    &lt;/tr&gt;
  &lt;/table&gt;
  &lt;/body&gt;
  </code></pre>