[jquery]如何实现页面单块DIV区域滚动展示

    // 未实现功能的代码 1（自己写的代码）
    var _cur_top = $(window).scrollTop();
           var num = $(".class_section").length;
           var wH = $(window).height();
           var t = [];
           var i = 0;
           $(window).scroll(function () {
               var sH = $(window).scrollTop();
               var total = wH + sH;
              // 滚动条的高度 + 窗口的高度
              $(".class_section").each(function (index) {
                var offsetTop = $(this).offset().top;
                console.log(++i);
                console.log('index:' +index +'offTop:' + offsetTop);
                
              });
           });
           console.log(t);
                   
    // 已实现功能的代码 2 （devin）
 var $contentList = $(".class_section");
            var _cur_top = $(window).scrollTop();
            var contentNum = $contentList.length;
            var  $nowActiveContent = $contentList.eq(0);
            // get the current position
            for(var i = 0 ; i < contentNum ; i++)
            {
                
                if($(window).scrollTop() <= $contentList.eq(i).offset().top + $contentList.eq(i).height()) {
                    $nowActiveContent = $contentList.eq(i);
                    break;
                }
            }
          
            //self.position($nowActiveContent);
             if($nowActiveContent.prev().length == 0){
                    $(window).scrollTop(0);
                } else{
                    $(window).scrollTop($nowActiveContent.offset().top);
                } 
            // manage the scroll's situation
            $(window).scroll(function(){
				var top = $(window).scrollTop();
                
                var cmpNowActiveTop = $nowActiveContent.prev().length == 0 ? 0 : $nowActiveContent.offset().top;
                var cmpNowActiveBottom = $nowActiveContent.next().length == 0 ? $("body").height() : $nowActiveContent.offset().top + $nowActiveContent.height();
                if(top >=  cmpNowActiveTop && top +  $(window).height() <= cmpNowActiveBottom){
                    _cur_top = top;
                    return;
                }
                
                
                if(_cur_top < top)
                {          
                    if(top > cmpNowActiveTop)
                    {
                        $nowActiveContent = $nowActiveContent.next().length > 0 ? $nowActiveContent.next() : $nowActiveContent;
                    }
                } else {   
                    if(top +  $(window).height() < cmpNowActiveBottom){
                        $nowActiveContent = $nowActiveContent.prev().length > 0 ? $nowActiveContent.prev()  : $nowActiveContent;
                    }
                }

               // self.position($nowActiveContent);
                if($nowActiveContent.prev().length == 0){
                    $(window).scrollTop(0);
                } else{
                    $(window).scrollTop($nowActiveContent.offset().top);
                } 
            
                _cur_top =  $(window).scrollTop();
	});