Simple Mobile UI Patterns: Page Swipe with iScroll and PhoneGap

After the Zepto.js swipe event version, here is another implementation of the “Page Swipe” UI pattern. This version is implemented with iScroll and its “snap” feature.

Watch a short video here:

Notice that the user experience is slightly different compared to the previous version: the content of the target page is revealed as you swipe.

The source code is available here.

11 Responses to Simple Mobile UI Patterns: Page Swipe with iScroll and PhoneGap

  1. Lucho July 19, 2012 at 1:41 am #

    Does this framework work a web based application? I guess not.
    Or Is only supported on phonegap “native” application?.
    Have you faced the UIViewClass memory restriction while developing PG apps?

    Thanks

  2. soomtong July 19, 2012 at 2:38 am #

    Thank you. very helpful code. this code more useful that before :)

  3. mfkrh August 1, 2012 at 4:50 am #

    Or Is only supported on phonegap “native” application?.

  4. wburningham August 1, 2012 at 9:32 pm #

    Is there a way to detect a screen resize (a device rotation in PhoneGap) that will resize the pages correctly so the scrolling still works?

    • wburningham August 1, 2012 at 9:41 pm #

      NM. I read the updateLayout function

  5. tony August 27, 2012 at 2:57 am #

    Thank you. Very well done.

  6. Justin October 5, 2012 at 5:54 pm #

    I’ve tried 2-way-iscroll (https://github.com/cubiq/2-way-iScroll) in the past and found that did the trick. The nice part is you only need one instance of iscroll.

  7. sohbet odalari December 21, 2012 at 12:00 am #

    hank you. very helpful code. this code more useful that before :)

  8. Karl Morrison May 19, 2013 at 7:52 pm #

    Broken on Android 4.0.4 sad to say! :(

  9. Resimli Tarifler July 25, 2013 at 9:14 am #

    Is only supported on phonegap “native” application? thanks.

  10. Adlan Khalidi August 1, 2013 at 6:31 am #

    iScroll 5 has been released. Can I just replace iscroll.js file with the latest one for this project?

Leave a Reply

css.php