がiOS10にはGoogle App内正しく動作しません。私たちのチームはそれをサポートするように求められました。
ビューの下部にボタンを配置する必要がありますので、bottom: 60pxでposition: fixedを選択して、この要件を満たすようにしました。
Evnironment
デバイス：iPhone7 のiOS：10.3.3 グールアプリ：33.0.164895372
問題
サファリ： Chromeを仕事： Googleのアプリを動作します。うまくいかない。正しい場所で、いずれかのボタン表示を垂直方向のスクロールを与える、またはちょうど私もposition: absoluteを試してみました
（実際のビューポートのボトムラインより下の）行方不明ながら、グーグルアプリの内部ブラウザは、右のビューポートの高さを知っていることはありませんようです親コンテナ（画面のフルサイズ）はありますが、運はありません。
誰も問題を以前に見たことがありますか？どのように修正する必要がありますか？
iOSのGoogle Appで同じ問題が発生しました。上下に絶対配置された要素を持つ高さ100％のウェブサイト。
原因
GoogleのAppのビューポートの高さが正しく検出されていますが、GoogleのAppは、ウェブサイト経由WELとして他のいくつかのバーのウェブサイト上と一番下に先頭に、デフォルトでは、彼のアドレスバーをのを置きます。だからGoogle Appに属するこれらの要素は、あなたのウェブサイト上の絶対的な配置要素のようなものです。
しかし、ウェブサイトを開くと、Google Appはウェブサイトを少しスクロールして、ウェブサイトの上部がアドレスバーの下にくるようにします（そうしないと、ウェブサイトの上部が非表示になります）。 100％高さのウェブサイトでは、ビューポートが100％+ 30pxのように見える30pxのようなウェブサイト全体を表示します。上部のアドレスバーと下部の他のバーが消えると、ウェブサイトは完全に表示されます。
回避策
viewpoのはinnerHeightにアプリの高さを再調整し、本体にディレクティブを追加します。 rt。私の場合に働いた。
<body force-full-height>
<!-- Your content -->
</body>
...
(function() {
var app = angular.module('my.directives', []);
app.directive('forceFullHeight', forceFullHeight);
forceFullHeight.$inject = [
'$window',
'$rootScope'
];
function forceFullHeight($window, $rootScope) {
return {
restrict: 'A',
link: function link(scope, element, attrs) {
function onResize() {
element.css('height', $window.innerHeight + 'px');
};
function cleanUp() {
angular.element($window).off('resize', onResize);
}
angular.element($window).on('resize', onResize);
scope.$on('$destroy', cleanUp);
scope.$on('$viewContentLoaded', onResize());
}
};
}
})();