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 - 防止用戶滾動過去某些滾動高度

回答

相關問題