Home » Jquery » jquery – Creating fullpage.js wrapper in a normal flow/scrolling page, removing fullpage.js scrollbar

jquery – Creating fullpage.js wrapper in a normal flow/scrolling page, removing fullpage.js scrollbar

Posted by: admin February 22, 2020 Leave a comment

Questions:

As the title suggests, I wish to know is there a possbility of creating a single fullpage.js wrapper in the middle of the document with its contents not interfering with the document flow. e.g. (only header is shown with 100wv, 100vh properties)

Desired result:

    <body>
       <div class="section">content</div>
       <div class="section">content</div>
       <div class="section">content</div>
       <div id="fullpage">
           <div class="section">content</div>
           <div class="section">content</div>
           <div class="section">content</div>
        </div>
    </body>

Following fullpage.js creator’s idea from other stack posts, I had placed the whole page into a fullpage.js wrapper and used scrollOverflow: true command to get the somewhat desirable efect.

    <div id="fullpage">
       <div class="section">overflowing content</div>       
       <div>
           <div class="section">content</div>
           <div class="section">content</div>
           <div class="section">content</div>
        </div>
       <div class="section">overflowing content</div>   
    </div>

If fullpage.js needs wrap the whole page, is there, at least, a way to remove scrollbars created by scrollOverflow: true.

How to&Answer: