Lets say I've got a site with vertical "slides". Each of them take sup a large portion of the screen. Is there any clean way to add vertical paging to the scrolling? Such as, if one scrolls near a specific horizontal point on the page, the page will slide so that the top border of the section meets the top of the window exactly?
I'm looking to add something similar to the iPhone's "vertical paging" feature to web apps. How would I go about doing this, is there any clean way to do it?
Here is an example of the iPhone's vertical paging...
http://www.youtube.com/watch?v=bgCcSF2Ip64
(sorry for poor video quality, I couldn't find any other examples of vertical paging)
The site I've currently got looks something like this, with vertical panes that one scrolls to. But if I had the paging, when you scrolled, it would lock you towards the nearest vertical "pane".
http://www.nikebetterworld.com/
(also, Nike better world is an awesome site)
Sencha touch allows for this feature in what they call a "carousel" follow this link to see a demo of it in action.
http://dev.sencha.com/deploy/touch/examples/kitchensink/
click "User Interface" then "Carousel", notice both vertical and horizontal scrolling. This uses panels, and is definitely better for touch screens, it's not very good for mouse interaction though. Anyways, these panels are very customizable. Good luck.