How to trigger a:hover with jQuery

I've now decided it's about time I learned how to use jQuery...

I want to know how to trigger an A:HOVER function for a menu. I have the latest jQuery downloaded (1.3.2).

I know that I have to edit the section highlighted below, but what do I put into it?

Code:

---

  <script type="text/javascript">
  $(document).ready(function(){
   
    $(document.body).click(function () {
      $("div:hidden:first").fadeIn("slow");
    });

  });
  </script>

---

My menu is this:

Code:

---

<div class="menu">
        <ul class="nav">
                <li><a href="/">Web</a></li>
                <li><a href="images/">Images</a></li>
                <li><a href="maps/">Maps</a></li>
                <li><a href="news/">News</a></li>
                <li><a href="video/">Video</a></li>
                <li><a href="gmail/">Gmail</a></li>
        </ul>
</div>

---

Yes, I'm trying to recreate Google... :)

Any help or tips would be appreciated.

// X96 \\

It's just like a css selector, try .menu .nav li a or .menu .nav li. I don't know which your trying to get to (listed both ways I would think you are).

Quote:

---

Originally Posted by X96 Web Design

I want to know how to trigger an A:HOVER function for a menu.

---

Try this:

HTML Code:

---

<script type="text/javascript">
$(function(){
    $('.nav a').hover(function(){
        $(this).css({'color':'red','background':'#ddd'});
    },function(){
        $(this).css({'color':'blue','background':'#fff'});
    });
});
</script>

---

I would recommend these nice tutorials: http://blog.themeforest.net/screencasts/jquery-for-absolute-beginners-video-series/

Good luck!