I have a very simple html page, which just has a div. I want to set
the height of the div to the screen height in BlackBerry.
But unforutnately, even when the screen height is calculated correctly
(480px), the div takes only some portion of that (400px). Any reasons.
I have the code below.
<!DOCTYPE HTML>
<html>
<head>
<meta name="viewport" content="width=device-width, height=device-
height, initial-scale=0.8, 'maximum-scale=0.8, 'minimum-scale=0.8,
user-scalable=no" />
</head>
<script type="text/javascript" charset="utf-8" src="javascript/
phonegap.js"></script>
<script type="text/javascript" charset="utf-8">
document.addEventListener("deviceready", function() {
alert('initialized');
}, true);
document.addEventListener('DOMContentLoaded', loaded, false);
function loaded(){
var pageH = window.innerHeight;
document.getElementById('outer').style.height = pageH + 'px';
}
</script>
<body>
<div id="outer" style="background: #green;">
<h1>Welcome to PhoneGap</h1>
<h2>Edit assets/www/index.html</h2>
</div>
</body>
</html>