Welcome!

Welcome to the official BlackBerry Support Community Forums.

This is your resource to discuss support topics with your peers, and learn from each other.

inside custom component

Web and WebWorks Development

Reply
Contributor
anzorb
Posts: 30
Registered: ‎02-04-2011
My Device: BB9900 & PlayBook16GB
Accepted Solution

Disable scrolling/zoom in webworks playbook app

I have searched for quite some time, but I cannot seem to find a way to lock the app in place, disabling double tap/pinch to zoom and scrolling..

Since webworks offers the ability to build full blown applications using web technologies, this is a very important functionality. Being able to scroll the page/zoom makes for a poor user experience.

 

Any help would be appreciated.

I am using webworks SDK version v1.0.0.2 Beta2

Developer
Accoductions
Posts: 42
Registered: ‎01-18-2011
My Device: PlayBook

Re: Disable scrolling/zoom in webworks playbook app

[ Edited ]

 

<meta name="viewport" id="viewport" content="initial-scale=1.0,user-scalable=no" />

initial-scale: Defines the initial zoom level. The range can be from 0 to 1.

user-scalable: Configures whether the user can change the zoom level. The value can be either yes or no.

 

Just add this little snippet to the <head> of your html file. =]

Contributor
anzorb
Posts: 30
Registered: ‎02-04-2011
My Device: BB9900 & PlayBook16GB

Re: Disable scrolling/zoom in webworks playbook app

Thanks a lot, that disabled zoom. Any idea on how to also disable vertical scrolling?

I am using overflow:hidden which does not show scrollbars in browsers,but I am still able to scroll the page by dragging within the simulator. There should be a way to lock it in completely, since it is technically an app not a webpage.

Developer
Accoductions
Posts: 42
Registered: ‎01-18-2011
My Device: PlayBook

Re: Disable scrolling/zoom in webworks playbook app

[ Edited ]
<meta name="viewport" id="viewport" content="width=device-width,height=device-height,initial-scale=1.0,user-scalable=no" />

 

When you compile and run your application on the simulator it shouldn't vertically scroll. While you're testing it on the simulator's web browser you can. *scratch chin*

 

 

Contributor
anzorb
Posts: 30
Registered: ‎02-04-2011
My Device: BB9900 & PlayBook16GB

Re: Disable scrolling/zoom in webworks playbook app

After doing more testing it seems that overflow:hidden on body does not disable scrolling like it does on Desktop browser. i removed the elements that are beyond 600 px and the app is locked in place. Thanks a lot.

Contributor
mrpaul
Posts: 14
Registered: ‎02-25-2011
My Device: Not Specified

Re: Disable scrolling/zoom in webworks playbook app

I have found that althought scrolling is disabled when you have proper element sizes, on the torch when you have the virtual keyboard popup, you can scroll. Is there a solution to this?

Contributor
jwedekin
Posts: 12
Registered: ‎07-21-2012
My Device: Blackberry Playbook

Re: Disable scrolling/zoom in webworks playbook app

[ Edited ]

Found a solution.

(Works on Blackberry Playbook)

Here is the jQuery:

$(document).bind('touchmove', function(e) {

    e.preventDefault();

    window.scroll(0,0);

    return false;

});

 

Basically, you are unbinding the webkit "touchmove" event.

 

Here is non-jquery:

document.addEventListener('touchmove', function(e) {

    e.preventDefault();

    window.scroll(0,0);

    return false;

}, false);

 

Edit: just looked at RIM's API: 

https://developer.blackberry.com/html5/api/Element.html