Fullpage.js: How to enable normal scrolling after section.

Created on 21 Nov 2018  路  4Comments  路  Source: alvarotrigo/fullPage.js

I apologise if I am being an idiot but I can't figure this out for the life of me.
I am using Fullpage.js for my website homepage and the scrolling system works perfectly for the 8 sections of the website I need it too. I can't figure out though how to turn the fullpage scrolling off for the bottom section of my webpage and go back to standard scrolling so I can preform a parallax effect. Should I be using fixedElements:, normalScrollElements:, scrollOverflow:, or the parallax plug in?
Also is there a way to have a snap transition between sections?

Thanks in advance.

question

All 4 comments

I think using the scrollOverflow would work fine

I can't figure out though how to turn the fullpage scrolling off for the bottom section of my webpage and go back to standard scrolling so I can preform a parallax effect.

You can't really do what you want without having a few issues.

Usually I recommend people to make use of scrollOverflow, which you can see in action on this example.
However, you won't be able to perform a custom parallax effect on it, as you won't be able to listen the scroll event.

The only other solution you can try is disabling the autoScrolling by using the method setAutoScrolling(false) detailed in the the fullpage.js documentation.
You can use it inside an afterLoad callback.

afterLoad: function(origin, destination, direction){
    if(destination.index == 3){
         fullpage_api.setAutoScrolling(false);
    }
    else{
        fullpage_api.setAutoScrolling(true);
    }
}

However, you'll have to turn on the autoScrolling again when scrolling up, and that is where you'll find the trouble.

Not an easy solution :)
Basically fullPage.js is not suppose to be used in that way.

Hello, sorry for the noob question here.
Is there a link where the ScrollOverflow script is hosted and accessible? Can I use the link to the one on github?
I'm new to development obviously :)

Any cdn as pointed out in the docs:
https://github.com/alvarotrigo/fullPage.js#optional-use-of-cdn

You can also un unpkg:
https://unpkg.com/fullpage.js/

Was this page helpful?
0 / 5 - 0 ratings

Related issues

vanloc0301 picture vanloc0301  路  5Comments

sloyer picture sloyer  路  3Comments

ortonomy picture ortonomy  路  3Comments

SlavisPL picture SlavisPL  路  5Comments

anonet1 picture anonet1  路  3Comments