モバイル ブラウザの「位置が固定される」問題を解決するにはどうすればよいですか?

モバイル ブラウザでの位置固定の問題

問題:
古いバージョンの iOS および特定の Blackberry ブラウザでは位置固定が機能しません

解決策:
この問題に対処するには、-webkit-backface-visibility: hidden プロパティを固定要素。

<code class="css">.fixed {
  position: fixed;
  top: 0;
  left: 0;
  width: 320px;
  height: 50px;
  background: red;
  -webkit-backface-visibility: hidden; /* This is the fix */
}</code>

説明:
-webkit-backface-visibility プロパティは、要素がユーザーから背を向けたときにどのように表示されるかを制御します。デフォルトでは表示されません。 hidden に設定すると、ブラウザは要素の同じレンダリング コンテキストを維持し、スクロールによる影響を防ぎます。

例:

<code class="html"><div class="fixed">
  Hi I'm Position Fixed
</div>
<div>
  <!-- Sample text -->
</div></code>

-webkit-backface-visibility:hidden プロパティを固定要素に適用すると、位置が異なる iOS や Blackberry ブラウザーであっても、要素が画面上の同じ位置に留まるようにできます。修正は完全にはサポートされていません。

以上がモバイル ブラウザの「位置が固定される」問題を解決するにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。