Bagaimana untuk Menghalang Bar Alamat daripada Bersembunyi dalam Penyemak Imbas Mudah Alih Apabila Menggunakan Kedudukan Mutlak?

Mengatasi Bar Alamat Berterusan dalam Penyemak Imbas Mudah Alih

Adalah perkara biasa bagi tapak web dengan reka letak yang tidak konvensional untuk menghadapi masalah dengan mekanisme penyembunyian automatik bar alamat dalam penyemak imbas mudah alih. Ini boleh mengganggu kefungsian dan mencipta pengalaman pengguna yang tidak diingini.

Masalah:

Tapak web yang sangat bergantung pada kedudukan mutlak dengan JavaScript untuk reka letak mendatar mereka sering menghadapi isu penatalan yang tidak disengajakan . Walaupun elemen berada dalam ketinggian tetingkap, bar alamat kekal tersembunyi, mencetuskan satu siri peristiwa yang tidak diingini:

• Ubah saiz acara apabila ia tidak sepatutnya
• Tingkah laku menatal yang salah dalam boleh ditatal secara menegak kandungan

Penyelesaian:

Untuk mengelakkan tingkah laku penyembunyian automatik ini, gabungan sifat CSS boleh digunakan:

CSS Kod:

<code class="css">html {
  background-color: red;
  overflow: hidden;
  width: 100%;
}

body {
  height: 100%;
  position: fixed;
  /* prevent overscroll bounce*/
  background-color: lightgreen;
  overflow-y: scroll;
  -webkit-overflow-scrolling: touch;
  /* iOS velocity scrolling */
}</code>

Penjelasan:

• html { limpahan: tersembunyi; }: Menghalang menatal di luar port pandangan.
• badan { ketinggian: 100%; }: Memastikan badan mengambil keseluruhan ketinggian port pandangan.
• badan { kedudukan: tetap; }: Membetulkan badan pada port pandangan, menghalangnya daripada menatal.
• body { overflow-y: scroll; }: Mendayakan tatal menegak dalam badan.
• badan { -webkit-overflow-scrolling: sentuh; }: Mengoptimumkan penatalan untuk peranti sentuh iOS.

Penyelesaian ini mengunci bar alamat dengan berkesan dalam keadaan dikembangkannya, membolehkan pengguna menatal dalam kawasan kandungan yang diingini tanpa mencetuskan peristiwa yang tidak diingini atau mengganggu reka letak visual.

Atas ialah kandungan terperinci Bagaimana untuk Menghalang Bar Alamat daripada Bersembunyi dalam Penyemak Imbas Mudah Alih Apabila Menggunakan Kedudukan Mutlak?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!