> iScroll dreams of Electric Sheep (aka v3.3 beta 3)

This latest update brings even better Android compatibility. If I receive no complains I’d consider this release final, freeze the code and move to the next milestone (3.4).

I added a 5 pixels threshold to the scroller. iScroll now holds on until the user moves at least 5 pixels in any direction. This subtle modification makes the scroller feel more natural and squashes the last bug which prevented full Android compatibility.

iScroll now loves iPhone, iPod touch, iPad and Android from 1.5 straight to 2.2. If you don’t believe me, believe your own eyes:

If no other bugs are found I consider version 3.3 near the end of its circle. Version 3.4 will add shrinkable scrollbars and hopefully Palm Pre compatibility. I’m also considering splitting iScroll in many smaller scripts each optimized for one platform. I’m waiting for your feedback about that.

Go to the iScroll project page to get the script.

/Share the joy

/Reactions

  • Great, I have tested the last version on my “old” Samsung Galaxy under Android 1.5, it’s working and I don’t need to refresh the page now.
    But there is a gap on the right (the place of the scroll bar?), and the scrolling is a little laborious, slow and unatural (doesn’t continue to scroll once “throwed”).
    But hey, I guess it’s usable !

    Congratulation for all the hard work, I know that working for multi-compatibility is a long a tough work !

    So thanks again Matteo !

    • Momentum is disabled by default on devices that don’t support translate3d. You can turn the deceleration animation on by passing the momentum:true parameter (but don’t expect smooth animation).
      Thanks again for your feedback!

    • Author: Tyler
    • Posted on: 2010/06/10
    • At: 19:45

    Just wanted thanks for this great script. It has saved my life. I do however have one problem… I am trying to duplicate your demo from http://cubiq.org/dropbox/iphonescroll.html using the latest version and am unable to get scrollTo() to work.

    Any help on this would be greatly appreciated. Thanks!

    • Author: Tyler
    • Posted on: 2010/06/11
    • At: 01:19

    You can ignore my last comment. I was trying to use maxScroll and didn’t realize you changed it to maxScrollX and maxScrollY.

    • Author: grigio
    • Posted on: 2010/06/11
    • At: 01:22

    Grande! On Htc Desire it works well and it seems a native GUI.
    Just a small issue, if you use the trackpad you can’t select each row separately

    • Author: Fiona
    • Posted on: 2010/06/11
    • At: 08:48

    This piece of work is so great~!!
    Thank you!

    However, I like the whole sum of work, despite of splitting them into pieces for specific platform.

    It’s such a nice piece of work as I can now use it across platform ;)

    • Author: michael
    • Posted on: 2010/06/11
    • At: 15:43

    I’ve noticed two things that I would hope could be addressed at some point:

    First, lets say I have a 200px high by 750px horizontal in the middle of my web page on the iPad. Dragging left/right works like a charm. However dragging up/down does nothing to the content of the scroller (which is good) but the surrounding page does not move up/down.

    If I drag up/down outside the scroller DIV it will. Is there any way to allow the page to drag up/down if initiated within the scroller DIV?

    Second, is there any chance of implementing click/drag by mouse support for non-touch devices? (aka traditional web browsers on laptops)?

    Otherwise, this is a top-notch library. Thank you very much.

      • Author: DeDi
      • Posted on: 2010/06/11
      • At: 16:08

      Second, is there any chance of implementing click/drag by mouse support for non-touch devices? (aka traditional web browsers on laptops)?

      I already gave Matteo the code for this, it’s fairly simple to implement.
      It would be nice if the author could implement this, if not you can leave me a reply and I will tell you how to do this.

      DeDi.

      • Author: michael
      • Posted on: 2010/06/11
      • At: 16:33

      Hi DeDi, that would be great and save me a lot of time. Thank you. You can provide a link, or email me: mi cha el ( and then AT ) ifelse Dot Org.

    • Fear not, click events will be handled in 3.4 (out reeeeally soon).

      Regarding the other issue, did you try by removing the touchmove event in the document?

      • Author: DeDi
      • Posted on: 2010/06/11
      • At: 21:33

      Great!

      Can’t wait for the new release, really interrested in the shrinkable scrollbars.

      michael: do you mind waiting for the new release?

      • Author: michael
      • Posted on: 2010/06/11
      • At: 23:19

      Not at all. Happy to explore myself but if its in the works then I’ll focus on other work. Thanks!

    • Author: Renaud
    • Posted on: 2010/06/14
    • At: 11:13

    Congratulations for your unique work and … for quoting Philip K Dick ;)

    • Author: vp
    • Posted on: 2010/06/17
    • At: 04:39

    Matteo,

    I spent a day and not able to figure out how to make the dropdown list to act normal in the iphone browser.
    I tried by adding a code below to the existing simple example …

    The issue is, the dropdown is not getting an event to show the the list to choose.

    Could you please provide some direction to go about it …

    Pretty content row 1
    Pretty content row 2
    Pretty content row 3
    Pretty content row 4
    Pretty content row 5

    Pretty content row 1
    Pretty content row 2
    Pretty content row 3

  • To all: the dropdown/select list inside the scrolling area is a really bad beast. There’s no simple solution for that, but I have an idea that could work. It’s in my top priorities.

      • Author: Mark
      • Posted on: 2010/09/24
      • At: 20:52

      Have you made any progress on the Select elements in the scrolling area?

    • Author: vp
    • Posted on: 2010/06/17
    • At: 22:57

    Thanks for reply Matteo,

    Just fyi, the dropdown will allow to select by iphone keypad next field button if the scrolling area contains a mix of input and select tags. Note, in this case too, we can’t choose dropdown with touch event.

    • Author: kaskooye
    • Posted on: 2010/06/18
    • At: 14:09

    Thanks Matteo !
    1st for you script,
    2nd as Renaud said, for quoting P.K Dick !

    I’ll test the whole thing tonight.

    • Author: H4CK3R
    • Posted on: 2010/06/19
    • At: 22:41

    Brilliant JOB!!

    Also on the splitting it into smaller device specific scripts, i would support that as i only develop for the iPhone at the moment?

    Though i admit the cross browser support is an attractive option if needed by others and i think the best solution (though sadly most work involved too :( ) would be for a universal big script and then smaller scripts for each device all available for an one that needs whichever script?