本文介绍了Fullpage.js:“下一个"和“上一个"按钮的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我有两个按钮:#btn1#btn2;我希望他们在点击时来回移动.因此,#btn1必须转到上一张幻灯片,当我单击#btn2时,它将转到下一张幻灯片.

I have two buttons: #btn1 and #btn2; and I want them to go back and forth when clicked. So #btn1 must go to previous slide and when I click #btn2 it goes to the next slide.

我将 fullPage.js 用于幻灯片.

在文档中说我必须使用这个

In documentation says that must me use this

$.fn.fullpage.moveSlideUp();
$.fn.fullpage.moveSlideDown();

但是我对Javascript很业余.你能帮我吗?

But I'm amateur with Javascript. Can you help me?

推荐答案

只需添加以下内容:

$('#button1Id').click(function(){
    $.fn.fullpage.moveSectionDown();
});


$('#button2Id').click(function(){
    $.fn.fullpage.moveSectionUp();
});

最好还是使用选项fixedElements.

$.fn.fullpage({
    fixedElements: '#button1Id, #button2Id'
});


更新


如果您使用的是fullpage.js 2.X,则无需使用选项fixedElements.如果在CSS中添加固定位置的样式,则仅对插件使用包装器并将固定元素放置在包装器外部即可正常工作.


UPDATE


If you are using fullpage.js 2.X then you dont need to use the option fixedElements. Just using a wrapper for the plugin and placing the fixed elements outside the wrapper will work fine if you add the fixed positioned styling in your CSS.

在线示例

这篇关于Fullpage.js:“下一个"和“上一个"按钮的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!

08-19 08:55