Saya mempunyai bar navigasi yang dalam mod mudah alih, cth. pada iPhone dalam Safari, menggunakan kelas ini
Tetapi entah bagaimana bar navigasi tidak muncul di bahagian atas.
.navbar-mobile { kedudukan: tetap; atas: 0; kanan: 0; kiri: 0; bawah: 0; latar belakang: rgba(0, 0, 0, 0.9); peralihan: 0.3s; -webkit-transform: translate3d(0,0,0); indeks-z: 999 !penting; -webkit-overflow-scrolling: auto !important; jidar atas: 0; } Ini berlaku dalam semua bahagian. Bahagian-bahagian ini terletak di dalam badan dengan komponen tspartikel digunakan seperti yang ditunjukkan di bawah.
bahagian { peralihan: mudah-masuk-keluar 0.3s; kedudukan: relatif; ketinggian: 100vh; paparan: flex; align-item: tengah; indeks z: 997; limpahan-y: auto; } badan { font-family: "Open Sans", sans-serif; warna latar belakang: #040404; warna: #fff; kedudukan: relatif; latar belakang: telus; indeks-z: -1; -ms-overflow-style: tiada /* IE dan Edge */ lebar bar skrol: tiada; /* Firefox */ lebar: 100vw; ketinggian: 100vh; } /* ---- tsbekas zarah ---- */ #tspartikel { lebar: 100%; ketinggian: 100%; indeks-z: -1; } Saya telah mencuba menggunakan -webkit-transform: translate3d(0,0,0); tetapi malangnya saya tidak dapat menyelesaikan masalah. Ini berfungsi dalam penyemak imbas lain, satu-satunya masalah ialah dengan Safari pada iPhone.
Kami mengalami isu yang sama pada semua penyemak imbas untuk IOS 16. Cuba tetapkan nilai indeks-z antara 0-9. Ini menyelesaikan masalah untuk kami.
.navbar-mobile { position: fixed; top: 0; . . z-index: 9; } section { transition: ease-in-out 0.3s; position: relative; . . z-index: 5; } body { font-family: "Open Sans", sans-serif; background-color: #040404; color: #fff; . . z-index: -1; //(或者尝试1) }