CODEWITHSUNDEEP
cordova
user2244523
user2244523

Reputation: 11

how to determine the screen resolution using phonegap?

I created several images for different screen resolutions. With what function fonegap can determine the screen resolution?

I would also like to see an example.

Upvotes: 0

Views: 1525

Answers (1)

aagarwal
aagarwal

Reputation: 134

You can also use $(window).width() and $(window).height() or screen.width; and screen.height;

Here is an example of this implementation using HTML, Javascript and JQuery mobile.

HTML PAGE:

<html>
    <head>
        <!-- put any jquery references here -->
        <script type="text/javascript" src="index.js">
    </head>
    <body>
        <div id=main_page">
        </div>
    </body>
</html>

Javascript file with JQuery:

$(document).ready(function ()
{
   resolution_handling();
});

function resolution_handling() 
{
    //first way to implement
    browser_width = $(window).width();
    browser_height = $(window).height();
    $("#main_page").css("width":browser_width+"px");
    $("#main_page").css("height":browser_height+"px");

    //second way to implement
    browser_width = screen.width;
    browser_height = screen.height;
    $("#main_page").css("width":browser_width+"px");
    $("#main_page").css("height":browser_height+"px");
}

Both of the implementations will make the div main_page have the dimensions of the screen's height and width.

I recommend using $(window).width() and $(window).height() as from experience it has been more stable than screen.width; and screen.height;

Upvotes: 2

Related Questions