document.addEventListener("touchmove", preventBehavior, false); - prevents me using from using overflow: scroll; - work around?

Question

Im using phonegap to build an ios app, so that you cant move the window phonegap uses document.addEventListener("touchmove", preventBehavior, false);

which is fine... but it also prevent me from using the css overflow:scroll on a section of text.

Is there a work arround that i can get both of these to still work ? is there a way i could load in the section of css after the js so that it overrides it ? or can i just apply the document.addEventListener("touchmove", preventBehavior, false); to the body but not its content ?

fyi window.addEventListener 'touchmove' - not document – Kevin Nov 05 '13 at 21:09 — Kevin, Nov 05 '13 at 21:09

score 3 · Accepted Answer · answered May 31 '12 at 16:05

3

Found a phonegap / cordova only work around that dosnt require you to use document.addEventListener("touchmove", preventBehavior, false); in the first place - go into your xcode project.. porject file > supporting files > cordova.plist then at the top change 'UIWebViewBounce' to NO.

from here

answered May 31 '12 at 16:05

sam

9,486
36
109
160

link broken, please fix – Carl May 20 '19 at 10:36

Bharath · Answer 2 · 2012-05-31T09:05:15.527

To capture all the scrolling pixels you can write

document.addEventListener("touchStart",<method>,true/false)
document.addEventListener("touchMove",<method>,true/false)
document.addEventListener("touchEnd",<method>,true/false)

Have you added touchEventListener in body load function ? If you write event.preventDefault(); It will kill the event behavior that is the reason why your overflow:scroll property is not working.

score 1 · Answer 3 · answered May 31 '12 at 07:17

1

I think you can detect the target element when "touchmove":

document.addEventListener("touchmove", function(event) {

    if (event.target.tagName != "TEXTAREA") { // Element that you don't want to be prevented default event.

          event.preventDefault();
    }
});

answered May 31 '12 at 07:17

Kevin

1,147
11
21

do i define the element "TEXTAREA" using css hooks ? ie. #detail-content – sam May 31 '12 at 15:48

score 0 · Answer 4 · answered Feb 24 '13 at 03:08

0

In the last version cordova.plist changed by config.xml, then set

"UIWebViewBounce" value="false"

answered Feb 24 '13 at 03:08

Martin

1

document.addEventListener("touchmove", preventBehavior, false); - prevents me using from using overflow: scroll; - work around?

4 Answers4

Linked