我有一个页面涉及 3 个部分,例如顶部、中间和底部。
每个部分都有固定的高度。假设在本例中为 600px;
在中间部分,我有一些内容超出了规定的 600 像素高度。例如1200 像素的内容。创建溢出,中间部分的内部滚动条。
我的问题是:
如何实现将提供以下场景的 jQuery 解决方案。
用户向下滚动经过顶部部分到中间部分,主滚动然后捕捉/切换到中间 - 内部内容,溢出高度为 1200px。一旦他们向下滚动到内容的末尾,他们就会离开中间部分,并且滚动会捕捉/切换回末尾部分。
你能提供解决方案吗?
提前致谢
最佳答案
更新:
这可能不完全是您想要的工作方式,但它以某种方式满足您的需要: 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;
}
});
关于javascript - 使用 jQuery 滚动并捕捉到内部元素,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/25826152/