0

phonegap(cordova) を使用して新しい iPhone アプリを作成しています。アプリで 1 つの問題がありました。誰かの入力フィールドをクリックすると、iPhone キーボードがポップアップし、ページ全体の位置が変化していました。固定フッターのように、キーボードの上にポップアップ表示されます。ガイドしてください。

ありがとうございました

4

1 に答える 1

0

これは「正しく」理解するのが難しい問題です。入力要素のフォーカスでフッターを非表示にし、ぼかしで表示することはできますが、iOS では常に信頼できるとは限りません。ときどき (たとえば、私の iPhone 4S では 10 分の 1 の頻度で) フォーカス イベントが発生しない (または競合状態がある可能性がある) ように見え、フッターが非表示になりません。

多くの試行錯誤の後、私はこの興味深い解決策を思いつきました:

<head>
    ...various JS and CSS imports...
    <script type="text/javascript">
        document.write( '<style>#footer{visibility:hidden}@media(min-height:' + ($( window ).height() - 10) + 'px){#footer{visibility:visible}}</style>' );
    </script>
</head>

基本的には、JavaScript を使用してデバイスのウィンドウの高さを決定し、CSS メディア クエリを動的に作成して、ウィンドウの高さが 10 ピクセル縮小したときにフッターを非表示にします。キーボードを開くとブラウザーの表示サイズが変更されるため、iOS ではこれが失敗することはありません。JavaScript ではなく CSS エンジンを使用しているため、はるかに高速でスムーズです。

注: 「visibility:hidden」を使用すると、「display:none」または「position:static」よりもグリッチが少ないことがわかりましたが、マイレージは異なる場合があります。

于 2014-09-12T22:06:18.357 に答える