title: How can I use jQuery to add a fade in hover effect to my nav items?
body: <p>I'm brand new to jQuery (and JS in general) and I know it is possible to use it to add a fade in effect to my navigation rollovers.</p>
  
  <p>Right now I'm using a master background sprite for the nav, and on :hover I'm just adding a background-position rule to shift the sprite down for each item to get my hover effect.</p>
  
  <p>But I'd like to use jQuery to bring a smooth transition to the rollover effect. I googled it and found some similiar info, but mostly what I found dealt with instances where you have two images and fading one out to reveal the other. But I'm using CSS background-position to simply shift the image down. Can I do this more smoothe with jQuery, and how?</p>
  
  <p>Here's the site:  <a href="http://tuscaroratackle.com" rel="nofollow noreferrer">http://tuscaroratackle.com</a></p>