jeff
jeff

Reputation: 13673

How to scroll with large pages with jQuery onepage-scroll plugin?

I found this great plugin called onepage-scroll, which meets my needs, except for one thing. Some of my pages (<section> tags) can be larger than one screen. How can I customize it so that it only scrolls when it finished the "regular" scrolling, inside the section ?

I tried to change the css rule :

.onepage-wrapper {
  width: 100%;
  /*height: 100%;*/
  height:200%;
  display: block;
  position: relative;
  padding: 0;
  -webkit-transform-style: preserve-3d;
}

but it still scrolls to the next page, with one scroll movement.

I'm trying to make it scroll to the bottom of the section (height > 100%), then scroll to the next page.

Any help will be appreciated. Thanks !

Upvotes: 0

Views: 2026

Answers (2)

Justin Mahon
Justin Mahon

Reputation: 1

While it's a less ideal solution, we ran into the same issue and found that using an iframe works with jquery onepage scroller as a solution for providing this.

Upvotes: 0

Alvaro
Alvaro

Reputation: 41605

You may want to use fullPage.js instead. There's an option called scrollOverflow which allow you to have scrolling inside section as you can see in this example

Upvotes: 4

Related Questions