使用jQuery滚动和捕捉内部元素

Question

我有一个涉及3个部分的页面，例如，顶部，中部和底部。

每个部分都是固定的高度。让我们说在这种情况下600px;

在中间部分，我有一些内容超过了规定的600px高度。对于例如内容1200px。在中间部分创建一个溢出，一个内部滚动条。

我的问题是：

我如何能实现一个jQuery的解决方案，将提供以下方案。

用户向下滚动到顶部到中间部分，主滚动然后捕捉/切换到中间内容，溢出高度为1200px。一旦他们滚动到内容的结尾，他们离开中间部分，滚动按钮/切换回结束部分。

您能否提供解决方案？

在此先感谢

Answer 1

更新：

这可能不是正是你想要的工作方式，但它确实你的方式所需要的：DEMO

var passed=false; 
$(document).scroll(function(){ 
    if($('body').scrollTop()>=$('#middle').offset().top && !passed){ 
     $('body').css('overflow','hidden'); 
     $('#container').css('overflow','auto'); 
     $('#container').attr("tabindex",-1).focus(); 
     $('#container').scrollTop(0); 
    } 
    else if($('body').scrollTop()<$('#middle').offset().top){ 
     passed=false; 
    } 
}); 
$('#container').scroll(function(){ 
    if($(this).scrollTop()+$(this).height()>=$('#long').height()){ 
     $(this).css('overflow','hidden'); 
     $('body').css('overflow','auto'); 
     passed=true; 
    } 
});