This is a page

Probably isn't the best way for making a web magazine, since is quite unoptimized - at least as is - but this magazine simulation is a good test on how much you can get creative when nesting scrollviews.

This page scrolls vertically one page after another one. Is a very common scenario in modern digital publishing when we're talking about tablets.

On desktop computers you can browse this scrollview-made magazine with the mousewheel and, on mouses with both horizontal and vertical wheels, you can switch between vertical and horizontal pages.

Now just go to the page below.

Spoiler alert!

In the last page of this column you will find some button for going back to this page. Nothing fancy but, if you're coming from there, I'm offering you a button for going back.

Scroll to the last sheet of this page
or, if you hate animations,
Move to the last sheet of this page

What you can put here?

Quite anything you can put on a web page. You can add more scrollviews, if you like... in this way:

I'm
Nested into
Another scrollview
And I'm
Into the
Second page!

Too lazy for dragging? Just hit one of these buttons to move the scrollview above.

Scroll to beginning
Scroll to end
Scroll to the third item

And, for animation haters...

Move to beginning
Move to end
Move to the third item

Notice that the horizontal scrolling movement is sent from the little scrollview above to the rest of the page when you reach the last item, since the springing has been disabled.

There is another page below...

But...

There isn't much to see here. Just go to the page on the right, swiping this from left to right. Oh! You can also hit these buttons, if you like.

Scroll to the top of this page
Scroll to the second sheet of this page
Scroll to the next page

Again, if you don't want to see any animation effect...

Move to the top of this page
Move to the second sheet of this page
Move to the next page

It's all about decisions.

Since you can freely decide what you can put inside each scrollview item, is not mandatory that you've to put another scrollview. That's the case: the content is into the second page without any scrolling object. That's why you'll never be able to scroll down this page: the vertical scrolling in this page has been disabled and his "bouncing" effect to.

There isn't much more to read, so you're ready for your decision. Where do you want to go?

Scroll to the first page
Scroll to the last page

Or, if you want just to be teletransported there...

Move to the first page
Move to the last page

...or just drag the page as usual.

That's all, folks!

Since this is a free scrolling scrollview, you aren't able to go back to the old page. If you disable the horizontal bouncing effect of this scrollview, the page will go back correctly when dragging left to right but... why adding an attribute to this scrollview? What you're dragging now is a scrollview with any particular attribute appended.

Is a plain sheet, that you can drag around and scroll freely to any direction.

Do you feel trapped?

Fear not, my son! I'm providing you the usual escape buttons, before filling this page of lorem ipsum lines.

Scroll to page 1
Scroll to page 2

Are you in a hurry? Hit these one instead!

Move to page 1
Move to page 2

Lorem Ipsum bomb!

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vestibulum at eros lacus, in pellentesque ante. Nulla pretium est eget sapien mollis molestie. Phasellus nec metus tellus. Suspendisse potenti. Pellentesque pulvinar ultrices imperdiet. Nullam in purus nec nibh eleifend pretium. Aenean eu metus lacus. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Pellentesque pellentesque elit non nisl auctor sit amet fringilla ipsum aliquam. Duis tincidunt fermentum magna id pellentesque. Ut nec sodales lacus. Vivamus vitae sapien id orci suscipit porta. Nunc metus turpis, volutpat id auctor id, volutpat vel risus.

Curabitur tempor, magna eu rutrum venenatis, ligula nisl sodales ante, quis sollicitudin elit augue fermentum augue. Suspendisse quam purus, adipiscing aliquet iaculis congue, dictum eget lorem. Maecenas eu massa sit amet risus tristique iaculis. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Nunc volutpat, ligula non volutpat vulputate, massa libero pretium quam, non vulputate ante velit et justo. Vivamus tincidunt porta accumsan. Phasellus tristique eleifend nisi tincidunt malesuada. Etiam vel adipiscing est. Aliquam eget erat enim. Nullam sapien nunc, consectetur mattis mollis et, venenatis at eros. Duis quis faucibus ligula.

Quisque eros metus, feugiat in pulvinar nec, pharetra id erat. Suspendisse at dui nisl. Praesent quam magna, elementum nec cursus ut, tincidunt porta eros. Nunc ac quam ligula. Maecenas purus magna, lobortis nec ultrices ac, aliquam vitae lacus. Morbi aliquet lacinia pulvinar. Donec mauris eros, dictum sed dapibus sit amet, vehicula quis lacus. Nullam eu velit in nibh auctor bibendum. Nunc et est lacus. Nulla fringilla arcu euismod sapien fringilla et condimentum enim lobortis. Etiam purus nibh, rhoncus eu pellentesque sed, condimentum sit amet nisl. Integer ipsum leo, consequat non rhoncus ac, interdum sed nisi.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vestibulum at eros lacus, in pellentesque ante. Nulla pretium est eget sapien mollis molestie. Phasellus nec metus tellus. Suspendisse potenti. Pellentesque pulvinar ultrices imperdiet. Nullam in purus nec nibh eleifend pretium. Aenean eu metus lacus. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Pellentesque pellentesque elit non nisl auctor sit amet fringilla ipsum aliquam. Duis tincidunt fermentum magna id pellentesque. Ut nec sodales lacus. Vivamus vitae sapien id orci suscipit porta. Nunc metus turpis, volutpat id auctor id, volutpat vel risus.

Curabitur tempor, magna eu rutrum venenatis, ligula nisl sodales ante, quis sollicitudin elit augue fermentum augue. Suspendisse quam purus, adipiscing aliquet iaculis congue, dictum eget lorem. Maecenas eu massa sit amet risus tristique iaculis. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Nunc volutpat, ligula non volutpat vulputate, massa libero pretium quam, non vulputate ante velit et justo. Vivamus tincidunt porta accumsan. Phasellus tristique eleifend nisi tincidunt malesuada. Etiam vel adipiscing est. Aliquam eget erat enim. Nullam sapien nunc, consectetur mattis mollis et, venenatis at eros. Duis quis faucibus ligula.

Quisque eros metus, feugiat in pulvinar nec, pharetra id erat. Suspendisse at dui nisl. Praesent quam magna, elementum nec cursus ut, tincidunt porta eros. Nunc ac quam ligula. Maecenas purus magna, lobortis nec ultrices ac, aliquam vitae lacus. Morbi aliquet lacinia pulvinar. Donec mauris eros, dictum sed dapibus sit amet, vehicula quis lacus. Nullam eu velit in nibh auctor bibendum. Nunc et est lacus. Nulla fringilla arcu euismod sapien fringilla et condimentum enim lobortis. Etiam purus nibh, rhoncus eu pellentesque sed, condimentum sit amet nisl. Integer ipsum leo, consequat non rhoncus ac, interdum sed nisi.