Dimension du plein écran sur Androïd
Bonjour,
Je développe une application qui doit tourner sur Firefox androïd, en plein écran.
Or j'ai des soucis avec la taille de l'écran de ma tablette de test (Samsug Galaxy Tab S2).
En plein écran innerHeight n'est pas toujours le même...
Quand je passe en plein écran en paysage j'obtiens 712, puis si je passe en portrait et que je repasse en paysage j’obtiens 735.
De même si je passe en plein écran depuis le mode portrait j'obtiens 1276, puis si je repasse en payasage puis que je reviens en portrait j’obtiens 1307.
La largeur est toujours de 980 quelque que soit la situation.
Comment passer en plein écran et obtenir la bonne* définition sans faire un passage 90°, puis normale...
*Bonne par ce que si j'utilise la première hauteur obtenue, j'ai une bande blanche en bas de mon écran que mon client trouve disgracieuse...
Evidement le problème ne se pose pas sur PC windows ou sous Chrome...
Si-dessous le code mettant cela en évidence :
Code:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
| <!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>tests plein ecran retaille</title>
<style>
.group{
display: flex;
flex-direction: column;;
}
.ligne{
display: flex;
flex-direction: row;
}
</style>
</head>
<body backgroundColor=Ivory>
<div id='main' class='group'>
<div id='heightgrp' class='ligne'>
<label> InnerHeight </label>
<input id='height' type='text'></input>
</div>
<div id='widthgrp' class='ligne'>
<label> InnerWidth </label>
<input id='width' type='text'></input>
</div>
</div>
<button id=FSbutton> Full Screen</button>
<script type="text/javascript">
var FullScreen = false;
onresize = function()
{
document.getElementById('height').value = window.innerHeight;
document.getElementById('width').value = window.innerWidth;
};
document.getElementById('FSbutton').onclick = function(){
if (!FullScreen){
this.innerHTML='Normal Screen';
if (document.documentElement.requestFullscreen) {
document.documentElement.requestFullscreen();
} else if (document.documentElement.msRequestFullscreen) {
document.documentElement.msRequestFullscreen();
} else if (document.documentElement.mozRequestFullScreen) {
document.documentElement.mozRequestFullScreen();
} else if (document.documentElement.webkitRequestFullScreen) {
document.documentElement.webkitRequestFullScreen();
}
FullScreen = true;
}
else{
this.innerHTML='Full Screen';
if (document.exitFullscreen) { /* for different navigator */
document.exitFullscreen();
} else if (document.webkitExitFullscreen) {
document.webkitExitFullscreen();
} else if (document.mozCancelFullScreen) {
document.mozCancelFullScreen();
} else if (document.msExitFullscreen) {
document.msExitFullscreen();
}
FullScreen = false;
}
};
</script>
</body>
</html> |
