CODEWITHSUNDEEP
jqueryscrollfullpage.js
mosgaz
mosgaz

Reputation: 41

Make one single page scrollable using fullPage.js

I'm trying to make one single section (page) with large content scrolling using fullPage.js. There is a method described here https://github.com/alvarotrigo/fullPage.js/#options, to set option scrollOverflow: true. But this option applies to all sections, this is not what needed. I searched throw methods https://github.com/alvarotrigo/fullPage.js#methods and found one $.fn.fullpage.setFitToSection(false);, but It's not for my case.

Is there any way to switch scrollOverflow option, depending on nextIndex (onLeave : function(index, nextIndex, direction))?

I found in source code

  /**
    * Sets fitToSection
    */
    FP.setFitToSection = function(value, type){
        setVariableState('fitToSection', value, type);
    };

So I think adding next code might help

  /**
    * Sets setScrollOverflow
    */
    FP.setScrollOverflow = function(value, type){
        setVariableState('scrollOverflow', value, type);
    };

Or more universal version

   /**
    * Sets any option variable
    */
    FP.setOptionVariable = function(variable, value, type){
        setVariableState(variable, value, type);
    };

But all this requires fullpage source code change. Any other ideas?

Upvotes: 0

Views: 834

Answers (1)

Alvaro
Alvaro

Reputation: 41595

From the fullpage.js documentation:

scrollOverflow: (default false) defines whether or not to create a scroll for the section in case its content is bigger than the height of it. When set to true, your content will be wrapped by the plugin. Consider using delegation or load your other scripts in the afterRender callback. In case of setting it to true, it requires the vendor plugin jquery.slimscroll.min and it should be loaded before the fullPage.js plugin.

Note the "in case its content is bigger than the height of it". No scroll bar will be created if the content of any other section is not bigger than the viewport height.

Upvotes: 0

Related Questions