Question

我在单页网站上使用fullPage.js。我的一个部分使用水平幻灯片水平显示幻灯片。我试图弄清楚如何从我的三个幻灯片系列的第二张幻灯片开始。阅读文档，我理解如何设置一个锚点并直接点击该幻灯片，但是当你通过垂直滚动到达系列时，我希望从幻灯片2开始。

我想也许用class ='active'来设置第二张幻灯片就可以了，但事实并非如此......实际上它打破了水平幻灯片。这是我有html和js明智的...想知道其中一个回调函数是否可行，但不清楚如何使用它们。

<div class="section" id="section5">
  <div class="slide"><div class="wrap"><h1>Hello fullPage.js</h1></div></div>
  <div class="slide"><h1>This is an awesome plugin</h1></div>
  <div class="slide"><h1>Which enables you to create awesome websites</h1></div>
</div>

这是我用来初始化函数....

$(document).ready(function() {
        $.fn.fullpage({
            anchors: ['home', 'welcome', 'about', 'services', 'faqs', 'contact'],
            menu: '#menu'
        });

    });

Answer 1

执行此操作的一种方法是在页面加载时滚动到该幻灯片（如果该部分不是登录部分，则对用户仍然是不可见的）。为此，您可以使用afterRender回调，然后，您可以修改插件的函数scrollSlider，使其公开，并可以从外部访问详细here。

然后你可以这样：

afterRender: function () {
    //getting the 2nd section by the index
    var section = $('.section').eq(1);

   //moving to starting slide of the 2nd section to the 2nd slide, for example
   $.fn.fullpage.scrollSlider(2, 1);
}

无论如何，我建议您将其添加为实施in the github issues forum of the plugin的建议。

fullPage.js从幻灯片2开始

1 个答案: