The container below can be scrolled vertically to read the content of the article, and can be swiped horizontally to move between articles. This example demonstrates a number of features:

Three examples of the gallery are shown, to show the different effects of the scrollBoundary and scrollResponseBoundary options.

Example One

This example is set up as you might want to set up a genuine gallery. Scrolling responds at once, using a scrollResponseBoundary of 1, but only locks scrolling to that axis after 15 pixels using a scrollBoundary of 15. Panning takes a little more to respond, with a scrollResponseBoundary of 8, and also locks to panning using a scrollBoundary of 20. Scrolls respond instantly but can convert to pans, and scrolling is preferred over panning if the input movement is diagonal.

Example Two

This example is set up an an example of all FTScroller instances being left at the default settings of scrollResponseBoundary: 1 and scrollBoundary: 1. This is generally undesirable with nested scrollers because finger-based input will often trigger a small scroll as the finger touches the screen, so it's hard to control the intended scroll direction.

Example Three

This example is set up with large boundaries (30px) for all scrollers or both the scrollResponseBoundary and scrollBoundary settings. This requires a reasonable move before scrolls become locked to an axis, reducing the chance of accidental scrolls or pans, but the equally high response boundary means there is no visual feedback before scrolling is locked, which is also not desirable.