Closed
Bug 1125566
Opened 10 years ago
Closed 9 years ago
[Android] incorrect window.innerHeight in Landscape mode
Categories
(Firefox for Android Graveyard :: General, defect)
Tracking
(Not tracked)
RESOLVED
WORKSFORME
People
(Reporter: labratmobi, Unassigned)
References
Details
Attachments
(1 file)
|
(deleted),
text/html
|
Details |
User Agent: Mozilla/5.0 (Windows NT 6.3; WOW64; rv:35.0) Gecko/20100101 Firefox/35.0
Build ID: 20150108202552
Steps to reproduce:
1. Visit http://labrat.mobi/games/astro_carl/ in Firefox for Android
2. Rotate screen to landscape
Actual results:
Game does not resize to fit the screen (works on Chrome) - was working fine in previous version of Firefox for Android.
Firefox returns incorrect window.innerHeight (probably ignoring the address bar height)
Expected results:
Game should have resized to fit the screen.
|
Reporter | |
Updated•10 years ago
|
OS: Windows 8.1 → Android
Hardware: x86_64 → All
|
|
Reporter | |
Comment 1•10 years ago
|
||
make sure to uncheck "fullscreen" and click "Tap to Play".
|
|
Reporter | |
Comment 2•10 years ago
|
||
Note: This happens when fullscreen browsing is enabled in settings.
This is annoying when you have "touchmove" mechanics in game, which makes the screen scroll.
|
|
Reporter | |
Updated•10 years ago
|
Product: Core → Firefox for Android
Version: 35 Branch → Firefox 35
|
|
Reporter | |
Updated•10 years ago
|
Severity: normal → critical
|
||
Comment 3•10 years ago
|
||
Possible dupe of bug 923663, 1071620?
Severity: critical → normal
Flags: needinfo?(bugmail.mozilla)
|
||
Comment 4•10 years ago
|
||
Not quite the same as those, but probably related. I filed a meta bug to track all of these things; I don't think this is something we can fix piecemeal and it's gonna need some dedicated time and effort from somebody.
Flags: needinfo?(bugmail.mozilla)
|
|
Reporter | |
Comment 5•10 years ago
|
||
I found a work around for this.
Previously I was using style.marginTop to vertical align my game container, now changed it to style.transform = "translate(...)"
This seemed to do the trick. Game now scales properly.
Probably using translate is a good practice as well.
But there are loads games out there which use marginTop to vertical align.
A simple test case that illustrates this issue:
<html>
<head>
<script type="text/javascript" >
window.onresize = function(){
document.getElementById("container").style.height = window.innerHeight + "px";
document.title = window.innerHeight;
};
</script>
</head>
<body style="margin: 0px">
<div id="container" style="
background: linear-gradient(yellow, purple);
width: 100%;">
</div>
</body>
</html>
This issue is not limited to window.innerHeight, the same issue exists if I try to get the height from a container with css "height: 100%" or "top: 0px; bottom: 0px;"
<html>
<head>
<script type="text/javascript" >
window.onresize = function(){
var container = document.getElementById("container");
document.getElementById("content").style.height = getComputedStyle(container).height;
document.title = getComputedStyle(container).height;
};
</script>
</head>
<body style="margin: 0px">
<div id="container" style="
width: 100%;
height: 100%;">
<div id="content" style="
background: linear-gradient(yellow, purple);">
</div>
</div>
</body>
</html>
|
|
||
Comment 8•9 years ago
|
||
|
|
||
Updated•9 years ago
|
Attachment #8652380 -
Attachment mime type: text/plain → text/html
|
|
||
Comment 9•9 years ago
|
||
Both the test case from comment 6 and the game in comment 0 seem to be working fine now in the latest Nightly build. If there are still issues please file a new bug. Thanks!
Status: UNCONFIRMED → RESOLVED
Closed: 9 years ago
Resolution: --- → WORKSFORME
|
Assignee | |
Updated•4 years ago
|
Product: Firefox for Android → Firefox for Android Graveyard
You need to log in
before you can comment on or make changes to this bug.
Description
•