jQuery —防止用户向上滚动超过一定的滚动高度

Question

我正在建立一个一页的网站。

基本上，我有这个动画的着陆页，其中包含着陆图像和自举jumbotron 。 我希望能够实现一个功能，一旦用户滚动超过jumbotron的末端，用户就无法向上滚动以查看着陆图像和jumbotron 。 从某种意义上说，要么隐藏或删除顶部的<div> ，要么完全禁用向后滚动到这些点。

我找到了以下代码，但是它会自动禁止在页面加载时向上滚动到页面顶部（200像素后）：

$(function() {
    var scrollPoint = 200;
    $(window).scroll(function() {
    $(window).scrollTop() < scrollPoint ? 
    $(window).scrollTop(scrollPoint) : '';
  }).scroll();
});

有任何想法吗？

Answer 1

您可以使用此代码隐藏超大屏幕。

$(window).bind('scroll', function() {
if($(window).scrollTop() >= $('#id_of_jumbotron').offset().top + 
 $('#id_of_jumbotron').outerHeight() - window.innerHeight) {
    hideTheJumboTron();
}
});

Answer 2

尝试这个：

$(function () {
    var scrollPoint = 200;
    $(window).scroll(function () {
        if ($(window).scrollTop() < scrollPoint) {
            console.log($(window).scrollTop());
            $(window).scrollTop(scrollPoint)
            return false;
        }
    }).scroll();
});