导航部分选中的背景跟随鼠标滑动

  为了让导航li的背景跟随鼠标比较平滑的移动，我进行了一系列尝试，最后发现，若背景加在li上让其跟随鼠标滑动，会出现卡顿效果，所以，将背景放在ul中，让其背景位置随着li的个数改变（  backgroundPosition: navLi.width() * n），这样比较平滑
HTML结构如下：

css代码如下：
 

#nav-div ul li a {
      text-decoration: none;
      height: 40px!important;
      line-height:40px;
      color:#333;
      font-size:16px;
}
  #nav-div {
      width:728px;
      height:45px;
      margin:auto;
      position:relative;
}
#nav-div ul {
      width:100%;
      height:45px;
      list-style:none;
      cursor:pointer;
      background:url(../images/border.gif)no-repeat;      //-----关键：背景图片
}
#nav-div ul li {
      float:left;
      width:104px;
      text-align:center;
      height:45px;
      line-height:45px;
      list-style:none;
}
  #liItemPaner {
      width:104px;
      height:45px;
      position:absolute;
}
.nav-side {
      width:728px;
      height:45px;
}

#nav .nav-on {
      border-bottom: 5px solid #f60 !important;
}

JS代码如下：
$(document).ready(function(e) {
      var navLi =$("#nav-div ul li"),
            navUl =$("#nav-div ul"),
            speed =200;

      functionOnClick() {
            n =navUl.find("li.on").index();
            navUl.stop().animate({
                  backgroundPosition: navLi.width() * n + 10         //--------点击后改变底线固定位置的关键
            },speed);
      }
      OnClick();
      navLi.hover(
            function(){
                  n =$(this).index();
                  navUl.stop().animate({
                        backgroundPosition: navLi.width() * n +10      //--------改变位置的关键
                  },speed);
            },
            function(){
                  OnClick();
            })
      navLi.click(function() {
            $(this).addClass("on").siblings().removeClass("on")
      });
      $(window).scroll(function() {
            if($(window).scrollTop() > $("#nav").height() + 50) {
                  $("#nav").addClass("scoll_nav")
            } else{
                  $("#nav").removeClass("scoll_nav")
            }
      });
})
          其实，若是导航底线跟随滑动，也可以采取相同的方法，只需将li的下边框底线截取成图片，放入ul中当背景图片就可以