nav导航随窗口滚动

  <style>

.fixed {

    position: fixed;

    top: 0;

    width: 100%;

    left: 0;

}

.navmain li {

    background: url(../images/navbg.png) no-repeat;

    width: 165px;

    height: 55px;

    float: left;

    text-align: center;

}

.navmain li a {

    font-family: '宋体';

    font-size: 24px;

    font-weight: bold;

    line-height: 55px;

    color: #003084;

}

.navmain li a:hover {

    color: #d94904;

}

  </style>

<div id="nav" class="nav">

    <ul class="navmain">

      <li><a href="#a1">凤眼聚焦</a></li>

      <li><a href="#a2">生态武汉</a></li>

      <li><a href="#a3">精致武汉</a></li>

      <li><a href="#a4">幸福武汉</a></li>

      <li><a href="#a5">党建武汉</a></li>

      <li><a href="#a6">文化武汉</a></li>

    </ul>

    <script type="text/javascript">

      var _offsetTop = $('#nav').offset().top;

      $(window).scroll(function () {

        var _scrollTop = $(document).scrollTop();

        if (_scrollTop > _offsetTop) {

          $('#nav').addClass('fixed');

        } else {

          $('#nav').removeClass('fixed');

        }

      })

    </script>

  </div>