Mobile/PhoneGap/Scrolling

iframes

edit

The app originally used <iframe>s but no longer does.

Android 2.x
vertical size auto-expands to fit content ("height" attribute ignored); no scrolling within the iframe
Android 3.x, 4.x
vertical size is set by 'height' attribute; scrolling is possible within the iframe, but touch targets don't scroll with their visible incarnations (upstream bug)
iOS 4.x
vertical size is set by 'height' attribute; no scrolling within frame? or two-finger scrolling? (testme)
iOS 5.x
testme

divs

edit
Android 2.x
overflow:auto/scroll is ignored
Android 3.x/4.x
overflow:auto/scroll works as expected
iOS 4.x
should work with two-finger scroll...?
iOS 5.x
set '-webkit-overflow-scrolling: touch' to get one-finger touch scrolling

whole document

edit

All systems do good scrolling of the whole document, and some work with position:fixed as well. But while we can fake this on the phone view, on the tablet view we need two side-by-side scrollable panels.

Falling back to use 'iscroll' library or similar on Android 2.x tablets may work well enough. Pretty darn slow in my last testing for actual content though.

Consider a fallback that uses iscroll on the sidebar...?