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
Developer
spikegotti
Posts: 45
Registered: ‎05-01-2013
My Device: Z10
Accepted Solution

Z10 and Q10 Screen Sizing.

Hi guys, I have successfully made my first HTML5 game for BB10.  However, I want this to support the Q10 as well, can anyone assisit me please in how to do such?

Retired
erikjohnzon
Posts: 245
Registered: ‎09-21-2012
My Device: Q10

Re: Z10 and Q10 Screen Sizing.

It depends where you need adjustements but here are some useful tips:

 

1. In javascript you can get the screen size using the following properties to update dynamic DOM elements:

- screen.width &  screen.height

 

2. Using CSS a media query can be done to update your style content:

 

- @media screen and (device-height:720px) and (device-width:720px) {

 

 

You can play around with these properties a bit. If you would like the actual innerHeight/innerWidth which can be useful in the case where you are ever invoked inside another applicatoin use the following in JS: window.innerHeight and window.innerWidth.

@erikjohnzon
erjohnson@blackberry.com
BlackBerry Development Advisor
oros
Posts: 1,557
Registered: ‎04-12-2010
My Device: BlackBerry Z10

Re: Z10 and Q10 Screen Sizing.

@spikegotti: Did Erik's response answer your question? If so please accept that thread as the solution.

As Erik noted, CSS media queries are a great way to style based on specific device properties.

Erik Oros | @WaterlooErik | eoros@blackberry.com | Developer Issue Tracker

If a reply has answered your question, please click Accept as Solution to help other visitors in the future.
Developer
spikegotti
Posts: 45
Registered: ‎05-01-2013
My Device: Z10

Re: Z10 and Q10 Screen Sizing.

Thank you very much :smileyhappy: It worked...