JQuery Mobile & Phonegap - Vertical scrolling choppy/harder

问题

I'm making an app with JQueryMobile and have come across a problem that I cannot find anywhere else on the internet.

My app has a large list, and before I implemented JQMobile, I could scroll as fast as I wanted. I could swipe my finger as fast as I wanted. I could fling the page and it would keep scrolling.

Now that I added JQMobile, there's a problem (it's more annoying than a full problem). On that same list, with nothing else added except JQmobile, scrolling is bad. I have to scroll/flick slower, and I have to stay with it. I cannot fling it as well as I could originally. It's not just in my head because I'm flicking it on two different galaxy nexuses (One has the original app installed, one has the jqm app installed)

Any ideas?

My one thought was that JQMobile was looking for swipes when I'm trying to scroll, so it doesn't scroll as well. Does JQMobile detect vertical swipes? If so, could that be the problem, and could it be disabled?

回答1:

I had this same issue and removing drop shadows helped in my case.

/* Get rid of shadows for performance 
.ui-bar-a 
.ui-shadow,
.ui-btn-up-a,
.ui-btn-hover-a,
.ui-btn-down-a,
.ui-body-b,
.ui-btn-up-b,
.ui-btn-hover-b,
.ui-btn-down-b,
.ui-bar-c,
.ui-body-c,
.ui-btn-up-c,
.ui-btn-hover-c,
.ui-btn-down-c,
.ui-bar-c,
.ui-body-d,
.ui-btn-up-d,
.ui-btn-hover-d,
.ui-btn-down-d,
.ui-bar-d,
.ui-body-e,
.ui-btn-up-e,
.ui-btn-hover-e,
.ui-btn-down-e,
.ui-bar-e,
.ui-overlay-shadow,
.ui-shadow,
.ui-btn-active,
.ui-body-a {
    text-shadow: none;
    box-shadow: none;
    -webkit-box-shadow: none;
}

来源：https://stackoverflow.com/questions/17286307/jquery-mobile-phonegap-vertical-scrolling-choppy-harder