2

How can I prevent a webpage from pulling to the left or right when swiping left or right in the webOS browser on the TouchPad?

Example: If you launch google.com in the browser of a TouchPad and then swipe left or right, you will notice that the page pulls to the left or right and exposes a grey background. However, if you go to maps.google.com and swipe left or right, the map pans and the page is locked in place. This is what I want to do. I do not want the page to pull beyond the edge of the browser, exposing the grey background.

I have created a carousel that uses a left and right swipe to navigate. It works perfectly in Safari on my laptop, but when I run it in the webOS browser it does not move and instead the entire page moves. How do I stop the page from moving and allow the carousel to receive my drag events?

prototyper
  • 23
  • 4
  • I changed the height of the page to fit the height of the browser and now I no longer have the above issue. Although this works for me, I would still like to know how to prevent the page from panning left and right even if the height is greater than the height of the browser. – prototyper Apr 04 '12 at 23:24

1 Answers1

1

If you don't want the screen to be scrollable and disable the bounces (that's what it's called) you should try:

document.ontouchmove = function(event){
    event.preventDefault();
}
sougonde
  • 3,438
  • 3
  • 26
  • 35