Question

I’m using jQuery Mobile and Scrollview. This has been the perfect solution for me so far as I had some bad experiences with the scrolling functions in jQuery Mobile, and again with a plugin called iScroll.

My only problem is that now all the div tags that have data-role="content" automatically has scrolling enabled, which is causing some final problems where some touch events aren’t firing because the touch must be caught as a scroll.

These errors only occur on two content pages, both of which don’t even require scrolling. I it enables scrolling on all content by design, but is there a way to disable scrolling for certain div tags?

Answer 1

I spent a long time trying all sorts of things, but the general idea was that I wanted a class I could use to stop the scrolling on that content div (noscroll).

Overriding the addClass method to prevent adding the ui-scrollview-view class caused a lot of errors elsewhere. I have no idea why, possibly another plugin on the page is trying to override it again?

Eventually I had to manually change scrollview.js, which as it happens is only a small file. On line 19, there’s a selector to select all elements where data-role is content. After this selector, I added .not('.noscroll').

Quick change, and I made sure I noted everywhere I could that I had changed this file from the original. But after 5 hours trying to find a better solution, I settled for it!