Fade in img on mouseover - Fullscreenr - jQuery
<p>I am looking to fade in an img (#bgimg) on mouseover of each individual anchor in my main nav. I would like a different img for each anchor. I am using the plug-in Fullscreenr and have four different img's each relating to a link with-in my main nav. On mouseout I would like it to go back to the original img. I only want to do this on my home page. Below is a link to the page I would like to use it on and a snip-it of my mark-up:</p>

<p><a href="http://tamedia.ca/marlowe/home.html" rel="nofollow">http://tamedia.ca/marlowe/home.html</a></p>

<pre><code>&lt;body&gt;
  &lt;img id="bgimg" src="img/bg-home.jpg" /&gt;

  &lt;div id="container"&gt;
  &lt;header&gt;      
       &lt;nav&gt;
        &lt;ul&gt;
          &lt;li&gt;&lt;a href="brand.html"&gt;BRAND&lt;/a&gt;&lt;/li&gt;
          &lt;li&gt;&lt;a href="collection-aw12.html"&gt;COLLECTION&lt;/a&gt;&lt;/li&gt;
          &lt;li&gt;&lt;a href="boutiques.html"&gt;BOUTIQUES&lt;/a&gt;&lt;/li&gt;
          &lt;li&gt;&lt;a href="contact.html"&gt;CONTACT&lt;/a&gt;&lt;/li&gt;
        &lt;/ul&gt;
       &lt;/nav&gt;
    &lt;/header&gt;
 &lt;/div&gt;
&lt;/body&gt;    
</code></pre>
