JQuery制作简单的网页导航特效

使用JQuery中hover()方法，使其根据鼠标的移动简单的改变背景颜色;

hover();用于模拟鼠标指针悬停事件，当鼠标指针移动到元素上时，会触发指定的第一个函数，当鼠标指针移除这个元素时，会触发第二个函数；类似于mouseover和mouseout组合具体的代码如下：

html代码：

<div class="nav">
          <ul>
          <li><a href="#">首页</a></li>
            <li><a href="#">身边导航</a></li>
            <li><a href="#">美食</a></li>
            <li><a href="#">电影</a></li>
            <li><a href="#">KTV</a></li>
            <li><a href="#">酒店</a></li>
            <li><a href="#">购物</a></li>
        </ul>
    </div>
css：

.nav{
          margin:0;
          padding:0px;
          width:800px;
          height:100px;}
  .nav ul{
          list-style:none;
}
  a{
          text-decoration:none;}
  .nav ul li{
          width:100px;
          height:50px;
          line-height:50px;
          background-color:#999;
          display:inline;
          float:left;
          text-align:center;
          font-size:18px;
          font-weight:bold;
}

Jq:

$(function(){
                  /*
                  导航背景颜色切换效果 hover()
                  */
                          },
                          function(){
                          });

                   });