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.

  • 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?


  • soomtong

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

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

  • wburningham

    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

      NM. I read the updateLayout function

  • tony

    Thank you. Very well done.

  • Justin

    I’ve tried 2-way-iscroll ( in the past and found that did the trick. The nice part is you only need one instance of iscroll.

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

  • Karl Morrison

    Broken on Android 4.0.4 sad to say! :(

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

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

  • Dr

    Hurrah, that’s what I was seeking for, what a information! present here at this website, thanks admin of this site.

  • Wow thuat was strange. I just wrote aan really long comment
    but after I clicked submit my comment didn’t show up. Grrrr…
    well I’m not writing all tuat over again. Anyhow, just wanted to say fantastic blog!

  • I’d like to thank you for the efforts you’ve put in writing
    this blog. I am hoping to check out the same high-grade content by you in the
    future as well. In truth, your creative writing abilities has inspired me to get my own, personal
    website now ;)

  • Can I just say what a relief to find an individual who truly understands what they are discussing on the internet. You certainly know how to bring a problem to light and make it important. More and more people should check this out and understand this side of the story. I was surprised you aren’t more popular since you certainly have the gift.

  • ali khan

    There are various methods that help the web page to improve its online search motor results positioning. That is known as Seo. The SEO industry is increasing in Indian and with the right and effective knowledge one can stay at the top of the web page. However, there is huge competition and that is why the SEO solutions Indian are consistently improving their technologies to offer the best outcome to their customers. binární opce demo

  • Hi, Great tutorial but I’m having a problem. No matter how many pages I add I can still only see 4 then the scrolling stops Am I missing something?

  • Formalarımızda kullandığımız kumaş; birinci sınıf mikro-interlok olup; esnek-fit, anti-bakteriyel, termo-balans ve hemen kuruma özelliğine sahiptir. Futbol maçlarınızda size hareket özgürlüğü sunan bu formalar; günlük olarak giyilebilecek kadar şık tasarlanmıştır. Forma Modellerimiz özel dikim ve Dijital baskılı olarak iki tür üretilmektedir.
    Firmamızın en fazla üretim yaptığı, spor çoraplarında kullandığımız ürünler: pamuk ,koton, polyester, naylon ve likradır. Anti-bakteriyel içermektedir.