jQuery - 防止用户滚动过去某些滚动高度

我正在制作一个单页的网站。jQuery - 防止用户滚动过去某些滚动高度

基本上，我有一个着陆图像和引导jumbotron这个动画登陆页面。我希望能够实现一个功能，一旦用户滚动到jumbotron的末尾，用户就不能向上滚动查看着陆图像和jumbotron。从某种意义上说，要么隐藏或删除顶部的<div>，要么完全禁用滚动回到这些点。

我发现这个代码，但它会自动禁用向上滚动到页面顶部（后200像素），在页面加载：

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

任何想法？

来源

2017-05-09 rehmanh

除删除滚动功能，只要确保体内的父容器是由具有200像素最大高度和溢出隐藏。所以下面的任何东西都不会被用户访问。如果你禁用滚动，那么你还需要找到scrollup事件并重新启用它，这很重要 –

你也可以在滚动函数内调用'event.preventDefault（）'一旦你跨越了'200px' –

@harshit我试过了这并没有做任何事情...... – rehmanh

您可以使用此代码来隐藏jumbotron。

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

来源

2017-05-09 06:37:25

-1

试试这个：

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

来源

2017-05-09 06:39:10

是的，这实际上比我发现的方法更好，但是有一个基本问题是无法在页面加载时滚动到页面顶部，**和这是一个问题。我希望用户能够在页面加载时看到jumbotron和它上面的元素，但是一旦这些元素已经滚动过去，我希望用户无法在那里滚动回来。 – rehmanh

你可以在'$（window）.scrollTop（）

jQuery - 防止用户滚动过去某些滚动高度

回答

相关问题