jquery - ratio - viewport height js



Existe-t-il un moyen d'empêcher le redimensionnement du viewport en raison des éléments de l'interface utilisateur comme la barre d'URL? (1)

Voir ce qui suit:

iOS 8 supprimé "minimal-ui" propriété viewport, y at-il d'autres solutions "soft plein écran"?

http://www.html5rocks.com/fr/mobile/fullscreen/

Mon problème est que je fais un site responsive et que la fenêtre soit toujours en plein écran, par exemple sur document prêt. Je veux que le corps soit 100% de la fenêtre de l'appareil INCLUS la hauteur de la barre d'URL et d'autres éléments de navigation et pour qu'il reste comme ça. Le redimensionnement rompt ma conception basée sur le pourcentage. J'ai inclus ce qui suit pour la fenêtre d'affichage:

<meta name="viewport" content="width=device-width, height=device-height, maximum-scale=1.0, minimum-scale=1.0, initial-scale=1.0" />

Les deux html et le corps sont stylés comme suit:

html {
  height: 100%;
  width:100%;
  margin: 0 auto;
  padding:0;
}

body {
    width:100%;
    height:100%;
    margin: 0 auto;
    padding: 0;
}

Avec jQuery, je pense avoir réussi à saisir la taille de l'écran après un redimensionnement et à le régler de cette façon

$(window).resize(function() {
    var height = $("body").css("height");
    $("body").css("height", height);
});

mais cela ne fonctionnera que si l'utilisateur descend d'abord (en haut maintient la barre d'adresse en place)

J'ai eu le même problème avec les entrées de formulaire et le clavier logiciel et utilisé ceci:

$("#name").focus(function() {
    var height = $("body").css("height");
    $("body").css("height", height);
});

J'ai cherché des solutions comme le minimum-ui (parti sur ios8) et j'ai besoin de plus que cela de toute façon, faites défiler jusqu'à 0,1, min-height, et d'autres solutions plus compliquées comme vérifier le type de périphérique etc mais je peux J'ai l'impression de l'avoir. Je suis assez nouveau à ce sujet, donc s'il me manque quelque chose d'évident, s'il vous plaît soyez gentil!





viewport