9

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.

I use fullPage.js for slides.

In documentation says that must me use this

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

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

Zentaurus
  • 758
  • 2
  • 11
  • 27
user3046428
  • 93
  • 1
  • 1
  • 3

1 Answers1

22

Just add this:

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


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

And better also to use the option fixedElements just in case:

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

You can read more about the fixedElements option in the fullpage.js docs.

UPDATE

If you are using fullpage.js > 2.X then you don't 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.

Example online

Alvaro
  • 40,778
  • 30
  • 164
  • 336