$(function(){
                //设置标杆
                var _line=parseInt($(window).height()/5);
                var v_height = $('.pageNav2').offset().top;
                
                
                $(window).scroll(function(){
                    //页面滚动到当前导航菜单，固定浮动在页面顶部
                    if ($(window).scrollTop()> v_height ) {
                        $('.pageNav2').addClass('fixtop')
                    }else{
                        $('.pageNav2').removeClass('fixtop')
                    };

                    $('.pageNav2 li').eq(0).addClass('active');
                    //滚动到标杆位置,顶部导航加active
                    $('.scroll-tane .about-rowblock').each(function(){
                        var _target=parseInt($(this).offset().top-$(window).scrollTop()-_line);
                        
                        var _i=$(this).index();
                        if (_target<=0) {
                            $('.pageNav2 li').removeClass('active');
                            $('.pageNav2 li').eq(_i).addClass('active');
                        }
                        //如果到达页面底部，给顶部导航最后一个加active
                        else if($(document).height()==$(window).scrollTop()+$(window).height()){
                            $('.pageNav2 li').removeClass('active');
                            $('.pageNav2 li').eq($('.fl_r li').length-1).addClass('active');
                        }
                    });
                });
                $('.pageNav2 li').click(function(){
                    $(this).addClass('active').siblings().removeClass('active');
                    var _i=$(this).index();
                     $('body, html').animate({scrollTop:$('.scroll-tane .about-rowblock').eq(_i).offset().top-_line},500);
                });
            });

演示地址：http://hw.lidgen.net/about.html

滚动监听2 侧栏固定 jquery 代码

$(".page-nav").prepend("<a href='' title=''></a>");
$(window).scroll(function () {
    var x = 0;
    $(".nav-area").each(function (index) {
        x = ($(window).scrollTop() >= $(this).offset().top - 200) ? index : x;
    });
    $(".page-nav a").eq(x).addClass("active").siblings("a").removeClass("active");
});
$(".page-nav a").click(function (e) {
    e.preventDefault();
    $(this).addClass("active").siblings("a").removeClass("active");
    //header固定用到
    var x = ($(window).innerWidth() > 991) ? 0 : 0;
    $("html,body").animate({
        scrollTop: $(".nav-area").eq($(this).index()).offset().top - x
    }, 500);
});

对应html代码（导航）

<div class="page-nav h10">
    <a href="#" title="" class="">Philosophy</a>
    <a href="#" title="" class="">Company Profile</a>
    <a href="#" title="" class="">CSR</a>
    <a href="#" title="" class="">History</a>
</div>

对应html代码（内容）

<div class="nav-area">
<div>item1</div>
<div>item2</div>
<div>item3</div>
<div>item4</div>
</div>

这个方法同样可以用来做fullpage整屏滚动切换