滚动过去后防止滚动回第一张幻灯片

Question

我正在使用fullpage.js，想知道如何防止用户在滚动过去后滚动回初始（第一张）幻灯片？

我仍然希望能够按预期在所有后续幻灯片之间滚动，但基本上删除第一张幻灯片，使其无法向上滚动（基本上使第二张幻灯片成为第一张，好像第一张不是更长的时间）。

希望这有意义吗？第一张幻灯片基本上是介绍/视频幻灯片，我只希望它在初始页面加载时显示，然后在滚动后通过它不再可访问。

Answer 1

只要到达第二部分，只需使用setAllowScrolling：

$('#fullpage').fullpage({
    afterLoad: function(anchorLink, index){
        //on load section 2...
        if(index == 2){
            $.fn.fullpage.setAllowScrolling(false, 'up');
        }else{
            $.fn.fullpage.setAllowScrolling(true, 'up');
        }
    }
});

Demo online

Answer 2

编辑： 原来这行不通。我正在调查，但接受的答案也不起作用，至少在 Chrome 42 上。我有lodged a bug report。

根据the documentation，您可以注册一个onLeave callback。向下滚动时，您应该可以将其用于.remove() 顶部幻灯片。解决方案如下所示：

<div class="section">
    <div class="slide" data-anchor="slide1"> Slide 1 </div>
    <div class="slide" data-anchor="slide2"> Slide 2 </div>
    <div class="slide" data-anchor="slide3"> Slide 3 </div>
    <div class="slide" data-anchor="slide4"> Slide 4 </div>
</div>
<script>
    $('.section').fullpage({
        onLeave: function(index, nextIndex, direction) {    
            if (index == 1) {
                $(this).remove();
            }
        }
    });
</script>

_{这都是理论性的，因为我从未使用过fullpage.js（虽然看起来很整洁），因此没有对此进行测试。}